jQuery深度笔记：从基础到高级

// 基础选择器
$( "#id" ) // 选择ID为id的元素
$( ".class" ) // 选择所有class为class的元素
$( "element" ) // 选择所有的element元素
$( "*selector" ) // 选择所有元素
 
// 层级选择器
$( "ancestor descendant" ) // 选择ancestor元素里的所有descendant元素
$( "parent > child" ) // 选择parent元素的直接子元素child
$( "prev + next" ) // 选择紧跟prev元素的next元素
$( "prev ~ siblings" ) // 选择prev元素之后的所有siblings元素
 
// 过滤选择器
$( ":first" ) // 选择第一个元素
$( ":last" ) // 选择最后一个元素
$( ":eq(index)" ) // 选择指定索引index的元素
$( ":even" ) // 选择索引为偶数的元素
$( ":odd" ) // 选择索引为奇数的元素
$( ":gt(index)" ) // 选择索引大于index的元素
$( ":lt(index)" ) // 选择索引小于index的元素
 
// 表单选择器
$( ":input" ) // 选择所有<input>, <textarea>, <select>和<button>元素
$( ":text" ) // 选择所有文本框
$( ":password" ) // 选择所有密码框
$( ":radio" ) // 选择所有单选按钮
$( ":checkbox" ) // 选择所有复选框
$( ":submit" ) // 选择所有提交按钮
$( ":reset" ) // 选择所有重置按钮
$( ":button" ) // 选择所有按钮
$( ":image" ) // 选择所有图像域
$( ":file" ) // 选择所有文件域
$( ":hidden" ) // 选择所有不可见元素
 
// 事件绑定
$( "#button" ).click(function() {
  // 当按钮被点击时执行的代码
})
 
// AJAX请求
$.ajax({
  url: "test.html", // 请求的URL
  method: "GET", // 请求方法
  data: { name: "John", location: "Boston" } // 发送到服务器的数据
}).done(function(response) {
  // 请求成功时的回调函数
  console.log("AJAX请求成功:", response);
}).fail(function(error) {
  // 请求失败时的回调函数
  console.log("AJAX请求失败:", error);
});

这段代码展示了jQuery的基础和高级用法，包括选择器、层级选择器、过滤选择器、表单选择器、事件绑定和AJAX请求。通过这些示例，开发者可以快速掌握jQuery的常用功能，并在实际开发中应用它们。