jquery 简写

jQuery 简写方式

jQuery 的 $ 符号是 jQuery 的别名，用于简化代码编写。以下是常见的 jQuery 简写方式和使用示例：

使用 $ 替代 jQuery

在大多数情况下，$ 可以完全替代 jQuery 关键字：

// 标准写法
jQuery(document).ready(function() {
    jQuery("p").hide();
});

// 简写
$(document).ready(function() {
    $("p").hide();
});

$(document).ready() 的简写

$(document).ready() 可以进一步简化为 $(function())：

// 标准写法
$(document).ready(function() {
    // 代码
});

// 简写
$(function() {
    // 代码
});

选择器的简写

jQuery 选择器可以直接通过 $() 调用：

// 标准 DOM 方法
document.getElementById("myId");

// jQuery 简写
$("#myId");

链式调用

jQuery 支持链式调用，可以在一行中完成多个操作：

// 非链式写法
$("#myDiv").css("color", "red");
$("#myDiv").fadeIn();

// 链式简写
$("#myDiv").css("color", "red").fadeIn();

事件绑定的简写

jQuery 提供了简洁的事件绑定方法：

// 标准写法
$("#btn").on("click", function() {
    // 代码
});

// 简写
$("#btn").click(function() {
    // 代码
});

Ajax 请求的简写

jQuery 为常见的 Ajax 请求提供了简写方法：

// 标准写法
$.ajax({
    url: "test.html",
    method: "GET",
    success: function(data) {
        console.log(data);
    }
});

// 简写
$.get("test.html", function(data) {
    console.log(data);
});

注意事项

• 如果其他库也使用了 $ 符号，可能会与 jQuery 冲突。可以通过 jQuery.noConflict() 释放 $ 的控制权：

  var jq = jQuery.noConflict();
  jq(document).ready(function() {
      jq("p").hide();
  });

• 在模块化开发中（如使用 ES6 或 Webpack），可以通过 import $ from 'jquery'; 直接使用 $。

jQuery 的简写方式可以显著减少代码量，同时保持可读性和功能性。