jquery $函数

jQuery $函数基础概念

jQuery的核心是$函数，它是jQuery()的别名。该函数用于选择DOM元素或创建jQuery对象，是操作网页元素的入口点。

选择DOM元素

通过CSS选择器获取元素并返回jQuery对象：

$('div') // 选择所有<div>元素
$('#header') // 选择id为header的元素
$('.menu-item') // 选择class为menu-item的所有元素

创建新元素

传入HTML字符串可创建新DOM元素：

$('<p>New paragraph</p>') // 创建新段落
$('<div class="box"></div>') // 创建带class的div

文档就绪事件处理

使用$()包裹函数，确保代码在DOM加载完成后执行：

$(function() {
  // DOM加载完成后执行的代码
});

DOM元素包装

将原生DOM元素转换为jQuery对象：

const elem = document.getElementById('content');
$(elem).hide(); // 转换为jQuery对象后调用方法

扩展功能

$函数可扩展为其他用途（需谨慎）：

$.extend({
  customMethod: function() {
    // 自定义全局方法
  }
});

避免冲突

当其他库也使用$时，可通过以下方式释放控制权：

jQuery.noConflict(); // 释放$变量
const $j = jQuery; // 使用新别名

参数类型处理

$函数根据传入参数类型执行不同操作：

• 字符串（选择器或HTML）
• DOM元素
• 函数（文档就绪回调）
• 对象数组（转换为jQuery集合）

链式调用

所有jQuery方法返回jQuery对象，支持链式调用：

$('button').addClass('active').attr('disabled', true).text('Click');