jQuery基础教程

1. jQuery的基础

jQuery 是一个广泛使用的 JavaScript 库，主要用于简化 DOM 操作和事件处理。它通过选择 DOM 元素、修改样式、添加动画效果等功能，帮助开发者更高效地构建用户界面。

2. 文档选择

在开始编写 jQuery 代码之前，首先需要选择一个合适的文档选择器。常见的选择器包括：

• $(“body”) - 选择整个页面的主体
• $(“div”) - 选择所有 div 元素
• $(“#id”) - 通过 ID 选择特定元素
• $(“.class”) - 通过类名选择元素

3. DOM 操作

jQuery 提供了多种方法来操作 DOM 元素，包括：

• $(“p”).text(“内容”) - 修改元素的文本内容
• $(“p”).html(“内容”) - 修改元素的 HTML 内容
• $(“p”).append(“内容”) - 在元素的后面添加内容
• $(“p”).prepend(“内容”) - 在元素的前面添加内容

4. 插入节点

通过 jQuery，可以通过 click 方法插入新的节点。以下是一个示例：

$(function () {  
    // 插入节点  
    // append  
    // $(A).prepend(B)，往 A 内部的末尾处插入 B  
    $("#btn1").click(function () {  
        var $strong = "jQuery 教程";  
        $("p").append($strong);  
    });  
});

5. 常用 jQuery 方法

• $(“p”).click(function () { ... }) - 给 p 元素添加点击事件
• $(“input”).change(function () { ... }) - 给输入框添加变化事件
• $(“div”).hover(function () { ... }) - 给 div 元素添加悬停事件