jquery常用方法(学习笔记)

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;

});


猜你喜欢

转载自blog.csdn.net/super_tianxinmomo/article/details/80897606
今日推荐