jquery帮助文档

jQuery 是一个快速、简洁的 JavaScript 库，简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。以下是 jQuery 帮助文档的核心内容整理：

基本语法

jQuery 通过 $ 符号或 jQuery 关键字调用，基本语法为：

$(selector).action()

• selector 用于查询 DOM 元素（如 "p"、".class"、"#id"）。
• action() 是对选中元素执行的操作（如 hide()、click()）。

选择器

jQuery 支持 CSS 选择器扩展：

$("p")               // 选择所有 <p> 元素
$("#test")           // 选择 id="test" 的元素
$(".demo")           // 选择 class="demo" 的元素
$("input[type='text']") // 选择类型为 text 的 input

事件处理

常见事件方法包括：

$("#btn").click(function() { 
  alert("按钮被点击");
});

支持的事件包括 hover()、mouseenter()、keypress() 等。

DOM 操作

• 内容修改：

  $("#div").text("新文本");    // 修改文本内容
  $("#div").html("<b>加粗文本</b>"); // 修改 HTML 内容

• 属性操作：

  $("img").attr("src", "new.jpg"); // 修改 src 属性

• 类操作：

  $("p").addClass("highlight");    // 添加类
  $("p").removeClass("highlight"); // 移除类

动画效果

• 基础动画：

  $("div").hide(1000);      // 隐藏元素（1秒）
  $("div").show("slow");    // 显示元素（慢速）
  $("div").toggle();        // 切换显示/隐藏

• 自定义动画：

  $("div").animate({ 
    left: '250px',
    opacity: '0.5'
  }, 1000);

Ajax 请求

简化 Ajax 操作：

$.get("url", function(data) {
  console.log(data); // 处理返回数据
});

$.post("url", { name: "John" }, function(data) {
  alert("数据已发送");
});

链式调用

jQuery 支持链式写法：

$("#p1")
  .css("color", "red")
  .slideUp(2000)
  .slideDown(2000);

文档资源

• 官方文档：jQuery API Documentation
• 下载地址：jQuery Download
• CDN 引入：

  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

以上内容涵盖了 jQuery 的核心功能，适用于快速查阅和入门。如需更详细说明，建议直接参考官方文档或交互式教程（如 Codecademy、W3Schools）。