Jquery 常用方法经典总结

简介

jQuery 是一个轻量级的 JavaScript 库，它封装了许多常用的 JavaScript 功能，使得代码更加简洁、易读和易于维护。本文将对 jQuery 常用方法进行总结和讲解，为大家提供使用 jQuery 开发网页的便利。

常用方法

选择器

选择器是 jQuery 最显著的特征之一，它支持 CSS3 中所有的选择器，以及新增的一些选择器。通过选择器可以快速、方便地选取页面中的元素，并进行操作。

常见的选择器包括：

• 标签选择器：选取指定标签的元素，如 $("p") 选取所有的 <p> 元素。
• 类选择器：选取指定 class 的元素，如 $(".class") 选取所有 class 为 class 的元素。
• ID 选择器：选取指定ID的元素，如 $("#id") 选取 id 为 id 的元素。
• 属性选择器：选取指定属性的元素，如 $("input[type='text']") 选取所有 type 属性为 text 的 input 元素。

示例：

<p class="intro">Hello world！</p>
<p class="intro">Hello jQuery！</p>
<p id="pid">Happy New Year！</p>
<input type="text" name="username" />

// 选取 class 为 intro 的所有元素
$(".intro")

// 选取 id 为 pid 的元素
$("#pid")

// 选取所有 type 为 text 的 input 元素
$("input[type='text']")

事件绑定

事件绑定是指为元素绑定特定的事件处理函数，例如单击、双击、鼠标悬停等事件，以响应用户的交互行为。

常见的事件绑定方法包括：

• click：单击元素时触发。
• dblclick：双击元素时触发。
• mouseenter：鼠标进入元素时触发。
• mouseleave：鼠标离开元素时触发。
• keydown：按下键盘上的某个键时触发。
• keyup：松开键盘上的某个键时触发。

示例：

<button id="btn">Click me！</button>

// 为按钮绑定单击事件
$("#btn").click(function(){
  alert("You clicked the button!");
});

// 为按钮绑定鼠标悬停事件
$("#btn").mouseenter(function(){
  $(this).css("background-color", "yellow");
});

// 为按钮绑定鼠标离开事件
$("#btn").mouseleave(function(){
  $(this).css("background-color", "");
});

总结

jQuery 是一个功能强大、易于学习使用的 JavaScript 库，包含了许多常用的方法、函数，可以大大简化 Web 开发的工作。本文介绍了 jQuery 中一些常用的方法，包括选择器、事件绑定等，可以帮助初学者快速掌握 jQuery 的使用方法。