jQuery常用操作方法及常用函数总结

1. 操作DOM元素

1.1 选择元素

• $()函数：jQuery中最基本的DOM操作方法，接受一个CSS选择器作为参数，返回匹配该选择器的元素列表。例如：

$("p") //选择所有<p>标签
$("#id") //选择id为id的元素
$(".class") //选择所有class为class的元素

1.2 操作元素属性

• attr()函数：获取或设置元素属性值，具体用法如下。

//获取属性值
$(selector).attr(attribute);

//设置属性值
$(selector).attr(attribute, value);

//例如为所有图片设置alt属性
$("img").attr("alt", "这是一张图片");

1.3 操作元素内容

• text()函数：获取或设置元素text内容，具体用法如下。

//获取文本内容
$(selector).text();

//设置文本内容
$(selector).text(newText);

//例如将所有p标签的文本内容设置为“Hello World！”
$("p").text("Hello World！");

2. 事件处理

2.1 添加事件

• on()函数：为选择的元素绑定事件，常用于为元素添加点击事件、鼠标移入事件等，具体用法如下。

//为某个元素添加点击事件
$(selector).on(eventName, function);

//例如为某个按钮添加点击事件弹出提示框
$("#btn").on("click", function(){
   alert("你点击了按钮");
});

2.2 移除事件

• off()函数：移除通过on绑定的事件，具体用法如下。

//移除绑定在某个元素上的事件
$(selector).off(eventName, function);

//例如为某个按钮绑定点击事件，并在事件触发后移除该事件
$("#btn").on("click", function handle(){
   alert("你点击了按钮");
   $(this).off("click", handle);
});

3. AJAX操作

3.1 发送HTTP请求

• $.ajax()函数：发送HTTP请求并返回请求结果，具体用法如下。

$.ajax({
   method: "GET",
   url: "/test.php",
   data: { name: "John", location: "Boston" }
}).done(function( msg ) {
   alert( "Data Saved: " + msg );
});

其中，method表示请求方法，url表示请求地址，data表示发送的数据。

3.2 jsonp请求

• $.getJSON()函数：使用JSONP进行跨域请求数据，具体用法如下。

$.getJSON("url", function(data){
   //处理获得的数据
}).error(function(){
   alert("请求失败了");
});

其中，该函数与ajax函数类型，在error函数中可处理错误情况。

以上就是jQuery常用操作方法及常用函数的总结，希望对您有所帮助。