当前位置:首页 > jquery

jquery 中的$

2026-03-17 13:03:54jquery

jQuery 中的 $ 符号

在 jQuery 中,$ 符号是 jQuery 的别名,两者完全等价。$ 是一个函数,用于选择 DOM 元素或创建 jQuery 对象。

$ 的基本功能

  1. 选择元素
    $ 可以接受 CSS 选择器作为参数,返回匹配的 jQuery 对象。例如:

    $('div') // 选择所有 div 元素
    $('#myId') // 选择 id 为 myId 的元素
    $('.myClass') // 选择 class 为 myClass 的元素
  2. DOM 就绪事件
    通过 $(document).ready() 或简写的 $() 确保代码在 DOM 加载完成后执行:

    $(function() {
      // DOM 加载完成后执行的代码
    });
  3. 创建 DOM 元素
    传递 HTML 字符串给 $ 可以动态创建元素:

    jquery 中的$

    $('<div>Hello</div>').appendTo('body');
  4. 封装 DOM 对象
    将原生 DOM 对象传递给 $ 可以将其转换为 jQuery 对象:

    $(document.getElementById('myId'));

$ 冲突处理

如果其他库(如 Prototype.js)也使用了 $,可以通过 jQuery.noConflict() 释放 $ 的控制权:

jquery 中的$

var jq = jQuery.noConflict(); // 之后用 jq 代替 $
jq('div').hide();

$ 的高级用法

  1. 链式调用
    jQuery 方法通常返回 jQuery 对象,支持链式调用:

    $('div').addClass('active').css('color', 'red');
  2. 扩展功能
    可以通过 $.fn 扩展 jQuery 的方法:

    $.fn.myPlugin = function() {
      return this.each(function() {
        console.log($(this).text());
      });
    };
  3. 工具方法
    $ 还提供了一些实用工具方法,如 $.each$.ajax

    $.each([1, 2, 3], function(index, value) {
      console.log(value);
    });

注意事项

  • $ 是函数而非变量,调用时需加括号。
  • jQuery 对象与原生 DOM 对象不同,原生对象需用 $() 封装后才能调用 jQuery 方法。
  • 现代开发中,原生 JavaScript 的 querySelectorfetch 已部分替代 jQuery 的功能。

标签: jquery
分享给朋友:

相关文章

jquery之家

jquery之家

jQuery之家资源推荐 jQuery之家(通常指提供jQuery相关资源的网站或社区)是开发者获取插件、教程和代码示例的重要平台。以下是几个与jQuery相关的优质资源网站: 1. jQuery官…

jquery 插入html

jquery 插入html

jQuery 插入 HTML 的方法 jQuery 提供了多种方法来动态插入 HTML 内容到 DOM 中。以下是几种常用的方法: append() 将内容插入到选定元素的内部末尾。 $("#…

jquery 选择

jquery 选择

jQuery 选择器基础 jQuery 选择器基于 CSS 选择器语法,用于快速定位和操作 DOM 元素。核心语法为 $() 或 jQuery(),括号内传入选择器表达式。 // 选择所有 <…

jquery 方法

jquery 方法

jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。以下是一些常用的 jQuery 方法及其用途: 选择器方法 $("selec…

jquery 使用

jquery 使用

jQuery 基础使用 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互的操作。以下是 jQuery 的基本使用方法。 引入…

jquery删除

jquery删除

jQuery 删除元素的方法 使用 jQuery 删除 DOM 元素有多种方式,可以根据需求选择合适的方法。 remove() 方法remove() 方法会删除选中的元素及其子元素,同时移除元素上的…