1、选择器
$(this) -- 选择当前元素
$("#test") -- 选择id=test的元素
$(".test") -- 选择class=test的元素
$("p") -- 选择所有<p>元素
2、jQuery HTML
三个简单实用的用于 DOM 操作的 jQuery 方法:
text() - 设置或返回所选元素的文本内容
html() - 设置或返回所选元素的内容(包括 HTML 标记)
val() - 设置或返回表单字段的值
attr()- 设置或返回所选元素的属性值 $("#w3s").attr("href");
3、jQuery遍历
祖先:parent() 、parents()、 parentsUntil()
$("span").parents("ul"); --span的所有祖先,且是ul元素 $("span").parentsUntil("div"); -- span和div之间所有祖先元素
后代:children()、 find()
$("div").children("p.c1"); -- 返回类名为c1的所有p元素,且是div的直接子元素
同胞:siblings()、next()、nextAll()、nextUntil()、prev()、prevAll()、prevUntil()
$("h2").siblings("p"); -- 返回属于 <h2> 的同胞元素的所有 <p> 元素
过滤:first()、last()、eq()、filter()、not()
$("div p").first(); -- div下第一个p元素 $("p").eq(1); -- 选取第二个p元素 $("p").filter(".intro"); -- 返回类名带有"intro"的所有p元素
4、jQuery中ajax的3种常用请求方式:
(1)$.ajax()返回其创建的 XMLHttpRequest 对象
$.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息。
如果你指定了 dataType 选项,请确保服务器返回正确的 MIME 信息,(如 xml 返回 "text/xml")。
$.ajax({
url: "/portal/validateCode/secondCheck?t=" + (new Date()).getTime(),
type: "POST",
async: false,
dataType: "json",
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
data: {name : "手机"}, 或者直接提交表单 $("#phoneForm").serialize(),
success: function (data, status) {
if (data.result.result) {
//TODO;
} else{
//TODO;
}
},error: function(){
//请求出错时调用
//TODO;
}
});
(2)通过远程 HTTP GET 请求载入信息
这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。
$.get("/portal/validateCode/getCaptchaId",function(result){
//TODO;
});
(3)通过远程 HTTP POST 请求载入信息
这是一个简单的 POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。
$.post("/login/loginSendYuyinMessage.do?interval=60", { username: username}, function(result){
//TODO;
});