jquery学习记录

时间：2023-01-27 16:08:06

1.选择器实例

语法 描述
$(this) 当前 HTML 元素
$("p") 所有 <p> 元素
$("p.intro") 所有 class="intro" 的 <p> 元素
$(".intro") 所有 class="intro" 的元素
$("#intro") id="intro" 的元素
$("ul li:first") 每个 <ul> 的第一个 <li> 元素
$("[href$='.jpg']") 所有带有以 ".jpg" 结尾的属性值的 href 属性
$("div#intro .head") id="intro" 的 <div> 元素中的所有 class="head" 的元素

2.jQuery 事件

下面是 jQuery 中事件方法的一些例子：

Event 函数 绑定函数至
$(document).ready(function) 将函数绑定到文档的就绪事件（当文档完成加载时）
$(selector).click(function) 触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件
$(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件 
3.隐藏和显示
     ① $(selector).hide(speed,callback);

     ② $(selector).show(speed,callback);

可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

下面的例子演示了带有 speed 参数的 hide() 方法：

实例

   $("button").click(function(){

     $("p").hide(1000);

   });
   ③$(selector).toggle(speed,callback);

可选的 speed 参数规定隐藏/显示的速度，可以取以下值："slow"、"fast" 或毫秒。

可选的 callback 参数是 toggle() 方法完成后所执行的函数名称。

4. 淡入淡出

通过 jQuery，您可以实现元素的淡入淡出效果。

jQuery 拥有下面四种 fade 方法：

  • fadeIn()     用于淡入已隐藏的元素
  • fadeOut()    方法用于淡出可见元素
  • fadeToggle()        jQuery fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。      如果元素已淡出，则 fadeToggle() 会向元素添加淡入效果。     如果元素已淡入，则 fadeToggle() 会向元素添加淡出效果
  • fadeTo()  方法允许渐变为给定的不透明度（值介于 0 与 1 之间）。

5.滑动

jQuery 拥有以下滑动方法：

  • slideDown()  方法用于向下滑动元素
  • slideUp()   方法用于向上滑动元素
  • slideToggle()    jQuery slideToggle() 方法可以在 slideDown() 与 slideUp() 方法之间进行切换。   如果元素向下滑动，则 slideToggle() 可向上滑动它们。   如果元素向上滑动，则 slideToggle() 可向下滑动它们

实例

   $("#flip").click(function(){

     $("#panel").slideToggle();

   });

6.动画

 jQuery animate() 方法用于创建自定义动画。

实例1

$("button").click(function(){

  $("div").animate({

    left:'250px',

    opacity:'0.5',

    height:'150px',

    width:'150px'

  });

});

实例2

隐藏，如果您希望在彼此之后执行不同的动画，那么我们要利用队列功能：

$("button").click(function(){

  var div=$("div");

  div.animate({height:'300px',opacity:'0.4'},"slow");

  div.animate({width:'300px',opacity:'0.8'},"slow");

  div.animate({height:'100px',opacity:'0.4'},"slow");

  div.animate({width:'100px',opacity:'0.8'},"slow");

});

7.停止

jQuery stop() 方法

jQuery stop() 方法用于停止动画或效果，在它们完成之前。

stop() 方法适用于所有 jQuery 效果函数，包括滑动、淡入淡出和自定义动画。

  实例：
  $("#stop").click(function(){
    $("#panel").stop();
  });

8.回调  jQuery Callback 函数
  $(selector).hide(speed,callback)

       callback 参数是一个在 hide 操作完成后被执行的函数。

实例：

   $("p").hide(1000,function(){

  alert("The paragraph is now hidden");

   });

9.Chaining 
 Chaining 允许我们在一条语句中允许多个 jQuery 方法（在相同的元素上）。
实例：

下面的例子把 css(), slideUp(), and slideDown() 链接在一起。"p1" 元素首先会变为红色，然后向上滑动，然后向下滑动：

 $("#p1").css("color","red").slideUp(2000).slideDown(2000);

10.获得内容和属性

三个简单实用的用于 DOM 操作的 jQuery 方法：

内容：

  • text() - 设置或返回所选元素的文本内容
  • html() - 设置或返回所选元素的内容（包括 HTML 标记）
  • val() - 设置或返回表单字段的值

    属性：

  • attr() 方法用于获取属性值
11：添加元素

   添加新的 HTML 内容

我们将学习用于添加新内容的四个 jQuery 方法：

  • append() - 在被选元素的结尾插入内容
  • prepend() - 在被选元素的开头插入内容
  • after() - 在被选元素之后插入内容
  • before() - 在被选元素之前插入内容
 实例：
 function appendText()
 {
  var txt1="<p>Text.</p>";               // 以 HTML 创建新元素
  var txt2=$("<p></p>").text("Text.");   // 以 jQuery 创建新元素
  var txt3=document.createElement("p");  // 以 DOM 创建新元素
  txt3.innerHTML="Text.";
  $("p").append(txt1,txt2,txt3);         // 追加新元素
 }

12. 删除元素/内容

如需删除元素和内容，一般可使用以下两个 jQuery 方法：

  • remove() - 删除被选元素（及其子元素）
  • empty() - 从被选元素中删除子元素

实例：

$("#div1").remove();

$("#div1").empty();

下面的例子删除 class="italic" 的所有 <p> 元素：

   $("p").remove(".italic");

13. 获取并设置 CSS 类

jQuery 拥有若干进行 CSS 操作的方法。我们将学习下面这些：

  • addClass() - 向被选元素添加一个或多个类
  • removeClass() - 从被选元素删除一个或多个类
  • toggleClass() - 对被选元素进行添加/删除类的切换操作
  • css() - 设置或返回样式属性

实例

$("button").click(function(){
        $("h1,h2,p").addClass("blue");
        $("div").addClass("important");
    });

下面的例子将返回首个匹配元素的 background-color 值：

  $("p").css("background-color");

下面的例子将为所有匹配元素设置 background-color 和 font-size：

 $("p").css({"background-color":"yellow","font-size":"200%"});

14.尺寸

jQuery 提供多个处理尺寸的重要方法：

  • width()   方法设置或返回元素的宽度（不包括内边距、边框或外边距）
  • height()   方法设置或返回元素的高度（不包括内边距、边框或外边距）
  • innerWidth()   方法返回元素的宽度（包括内边距）
  • innerHeight()  方法返回元素的高度（包括内边距)
  • outerWidth()   方法返回元素的宽度（包括内边距和边框）
  • outerHeight()   方法返回元素的高度（包括内边距和边框）

实例：

$("button").click(function(){
         var txt="";
         txt+="Width: " + $("#div1").width() + "</br>";
         txt+="Height: " + $("#div1").height();
        $("#div1").html(txt);
     });

显示文档和窗口的尺寸

$(document).ready(function(){
         $("button").click(function(){
           var txt="";
           txt+="Document width/height: " + $(document).width();
           txt+="x" + $(document).height() + "\n";
           txt+="Window width/height: " + $(window).width();
           txt+="x" + $(window).height();
          alert(txt);
         });
    });

15 遍历

aaarticlea/png;base64,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" alt="" width="540" height="417" />

①祖先

向上遍历 DOM 树

这些 jQuery 方法很有用，它们用于向上遍历 DOM 树：

  • parent()  方法返回被选元素的直接父元素。
  • parents()   方法返回被选元素的所有祖先元素，它一路向上直到文档的根元素 (<html>)
  • parentsUntil()   方法返回介于两个给定元素之间的所有祖先元素

实例：

$("span").parent().css({"color":"red","border":"2px solid red"});

aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAisAAAGHCAIAAAD++oV3AAAPPElEQVR4nO3d4W7bOhKA0b7/6/WBZv/cbV1JZkiJ0pDUORAWjSLTTAzMB9m52F8BABl+ZW8AgJdSIAByKBAAORQIgBwKBEAOBQIghwIBkEOBAMhxUKDfALyYAgGQI79Aj+0AgEEoEAA5FAiAHAoEQA4FAiCHAgGQQ4G+2u/q2z5P7//zgWP+EgDuo0B/t1E+Wd7k5sqav3avLNwIvxyAOyjQf3vYfNn6308VWtXUFREC3mOOAm2u6bvpH+9FCl8elunHAtXfTlU+BGBGcxQojuZ+rz19K8S+KJvz39apD1jlCuVHAUxqygJ1VL7h+ExOIQ9xFMjyu3aH65y4NwKYlwId56SsvE7lTY8CAS83eoH2c/8wAzXXfFu/Yfs/bfJwzfJPV78TBQIWM3SBmm4s6ud+zWX1N0C/d+/UKRBAjXELVJ7j5YfU/0j1b5GVt7EpUDla+xUeu10DGIcCXSrQ4fnWu7GLt2sAk1qwQK0/z7elKt+F2y/SVKDKPcsPsJ5xCxT/3tNUjvUTP0xN/5rO3/E5kAIB6xm6QJ/f3fzj2x3JuR+mfp2OBbr+pABTG71Aj9ln48S7cIVHbRJVWKf+Fgpgagp07Mo9UHnZmivH/J0A9KVAAORQIAByKBAAORQIgBwKBEAOBQIghwIBkEOBAMihQADkUCAAcigQADkUCIAcCgRADgUCIIcCAZBDgQDIsUKBfgOQ5Pr0vrJCEwUCWMr16X1lhSY3FujKCgC0mm56KxDAIqab3goEsIjpprcCASxiuumtQACLmG56KxDAIqab3qsV6PTzfj5QPoEZTTe9VyjQ5rk2LdmoWeHwzLeTAIOYbnpPX6ByPApxKp9svRgg3VzTOwYpUPkGpfzA/SKfS/1YoPKTihAwEQU6v0LHh1QWqPCM31Y4t0+AByjQ+RVaH1Lz7lnfz4FObxXgAQp0foWbCtT6kJrNKBAwIAX6usLm5P6aLgVq/Rzo8Fs/7kSBgAEpUGmF05/KfHuWwzP7/615CgUCZqdApRVuLdDmvufP/278uGDNNhQIGJAClVa4+x5of771KSr3oEDAgBSotELfAn17yOkCVd4DyQ8wJgUqrbBpw1AFqv8cSIGAMSnQDyt8fh6z+UfNRzWHCxbOVBaovEjNeYB0CtRnhdan23/5u6hmq13u0gAeM930XqFA+2evvKzmytyfBaDedNN7wQIBvNN001uBABYx3fRWIIBFTDe9FQhgEdNNbwUCWMR001uBABYx3fRWIIBFTDe9FQhgEdNNbwUCWMR001uBABYx3fRWIIBFTDe9FQhgEdNNbwUCWMR001uBABYx3fRWIIBFTDe9FQhgEdNN71EL9OuXw+FwvPFInb0KFBEK5HA43nqkzl4Fioi4/koATEaBuuxAgQCaKVCXHSgQQDMF6rIDBQJopkBddqBAAM0UqMsOFAigmQJ12cFSBarZxuaayp1/XjbIDwskUqAuO5ivQIXnOlGgmkdVPkSZ4D0UqMsOJivQ5l7kxH8y9udM6/U150UIXkKBuuzgxgIV/rPhcy/eiZuVc9dUXixC8FoK1GUHt98D3V2gyrufw++WPxOq+aFOvKcHLECBuuwgp0DnnuWO84WWFJY6cW8ErESBuuzgpQU699HRj4vXfBdYgAJ12UFCgQqfD5WfpfDsNSEp7Kfp2bt8HAVMTYG67CDtHqhjgVrP13/ec3iNAgEK1GUHKxSo/h7o828Qzt08teYKWJICddnBCgWqOV/z92+9bm4UCJanQF12ME2Bvj3kyudATW/HVd4DyQ+8gQJ12cEKBbryvH++rP/zNn8IByhQlx3cWKBvdyQ1dyqF5/rxTOv5H7dx/UmBxShQlx3cfg/UXc2fEhxGbv822ua7TXHaf0t+4D0UqMsO5ivQFeXe1Fywv36Wnx3oSIG67OBdBQLoQoG67ECBAJopUJcdKBBAMwXqsgMFAmimQF12oEAAzRSoyw4UCKCZAnXZgQIBNFOgLjtQIIBmCtRlBwoE0EyBuuxAgQCaKVCXHSgQQDMF6rIDBQJopkBddqBAAM0UqMsOFAigmQJ12YECATRToC47UCCAZgrUZQcjFOg3wONGmHu5KzRRIIBuRph7uSs0WbxAl/YAUG2NuadAETHEKwFQb425p0ARMcQrAVBvjbmnQBExxCsBUG+NuadAETHEKwFQb425p0ARMcQrAVBvjbmnQBExxCsBUG+NuadAETHEKwFQb425p0ARMcQrAVBvjbmnQBExxCsBUG+NuadAETHEKwFQb425p0ARMcQrAVBvjbmnQBExxCsBUG+NuadAEXHvK/H7X58XHz5qc/H+eqkDBp97j63Q5HUF2pzcR2VzTc31+8uAtxl57j25QpO3F+jb+f2X+9ugmmWBlxh57j25QpPXFSiOchLFohz+W4GAT4PPvcdWaPLGAm0u2/zj4nngnSaae7eu0OR1BaopSs29kQIBn0aee0+u0OSNBfr2Ltz+5OFD9ld+eyDwHiPPvSdXaPK6AhWuv/J0wMvNOPfuWKGJAv29WISA06abezet0ESBADpYY+4pUEQM8UoA1Ftj7ilQRAzxSgDUW2PuKVBEDPFKANRbY+4pUEQM8UoA1Ftj7ilQRAzxSgDUW2PuKVBEdHslAJ40wtzLXaGJAgF0M8Lcy12hybIFApiMAnXZgQIBNFOgLjtQIIBmCtRlBwoE0EyBuuxAgQCaKVCXHSgQQDMF6rIDBQJopkBddqBAAM0UqMsOFAigmQJ12YECATRToC47UCCAZgrUZQcKBNBMgbrsQIEAmilQlx0oEEAzBeqyAwUCaKZAXXagQADNFKjLDhQIoJkCddmBAgE0U6AuO1AggGYK1GUHCgTQTIG67KBbgRwOh+NtR+rsVaCIUCCHw/HWI3X2KhAAZ0w3vRUIYBHTTW8FAljEdNNbgQAWMd30ViCARUw3vRUIYBHTTW8FAljEdNNbgQAWMd30ViCARUw3vRUIYBHTTW8FAljEdNNbgQAWMd30ViCARUw3vRUIYBHTTW8FAljEdNNbgQAWMd30ViCARUw3vRUIYBHTTW8FAljEdNNbgQAWMd30vrFAADzv+vS+skITBQJYyvXpfWWFJrcUCIAZKRAAORQIgBwKBEAOBQIghwIBkEOBAMihQADkUCAAcigQADkUCIAcCgRADgUCIIcCAZBDgQDIoUAA5FAgAHIoEAA5FAiAHAoEQI5RCgTAOykQADkyCwQAD1AgAHIoEAA5FAiAHAoEQA4FAiCHAgGQQ4EAyKFAAORQIAByKBAAORQIgBwKBEAOBQIghwIBkMP/PxAA/1AgAHLkF+ixHQAwCAUCIIcCAZBDgQDIoUAA5FAgAHIo0IHT+/l84Gg/FMBoFOjvNr59WfnX6/vzh1eO8MMCjECB/ttD4UwhTuWTrRcDvMocBdpc03fThdud/QX7Lw/P/PhdEQKYo0Bx1Ilee/rx9qVcoMJOvq1QfhTAS0xZoI5q3j3r+zlQ5XcBlqdAVQVqfUj5yprvAixv9AIdfiqzf0jNNd/WLzzp4TU1b7uVL6u8AGBtQxeo6UakvhM16+z/t2ZlBQKoN26BynO//JD6H+nbspsC1XwOtH9g01MDvI0CdfscqP6CpssAVrVggVp/nh+fvalAlXuQH4BxCxT/3tNUZuDED9OxQPWfAykQwNAF+vzu5h/fPpI598OU1zkdv46ZBFjP6AV6zGFm9n+DcBi/8m1c68dIAC+hQMcqt1S5+TF/RoBcCgRADgUCIIcCAZBDgQDIoUAA5FAgAHIoEAA5FAiAHAoEQA4FAiCHAgGQQ4EAyKFAAORQIAByKBAAORQIgBxLFOjXL4fD4XDkHBcokMPhcDguHBcsVCAAnqRAEQoEkEGBIhQIIIMCRSgQQAYFilAggAwKFKFAABkUKCKjQDVPt7mmcoefl8kqMDIFiritQIU1TxSo5lGVD1EmYAQKFHFPgTb3Iif+s6w/Z1qvrzkvQkA6BYq4oUAnblbOXVN5sQgBA1KgiKcKVHn3c/jd8mdCNW/3nXhPD+BWChTRu0BN74bVny+0pLDUiXsjgGcoUMTYBTr30dGPi9d8F+BWChTx5bfw+Q5Yl49k6kPybZ3WT4+6fBwFcBMFivj+W/g8X/9r6ngPVP95z+E1CgSMTIEiigUqfFlYrfAslfdAmzuwEzdPrbkCeJgCRTxYoJrzNX//1uvmRoGARAoU0btA36688jlQ004q74HkB8ilQBF1Bbr+xwjX741qdlK/ZwUCcilQxE9/iXDud1T/l2xNfwvXGpXWJwV4jAJFVL8Ld2LZ+DdjPx6bBx7u8HC35XfzTr+dCHAfBYoozvSsYV3uTc0F++uFBxiKAkWYzgAZFChCgQAyKFCEAgFkUKAIBQLIoEARCgSQQYEiFAgggwJFKBBABgWKUCCADAoUoUAAGRQoQoEAMihQhAIBZFCgCAUCyKBAEQoEkEGBIhQIIIMCRSgQQAYFilAggAwKFNHttwDwNiPM3kt7aKFAAAMZYfZe2kOLoQt0aQ8AU3nh7FUggCG8cPYqEMAQXjh7FQhgCC+cvQoEMIQXzl4FAhjCC2evAgEM4YWzV4EAhvDC2atAAEN44exVIIAhvHD2KhDAEF44exUIYAgvnL0KBDCEF87e+Qr0+1+fFx8+anPx/nqpA0Yw+Oy9w2QF2pzcR2VzTc31+8sAnjfy7L3J3AX6dn7/5f42qGZZgMeMPHtvMlmB4ignUSzK4b8VCBjN4LP3DvMVaHPZ5h8XzwNkmWj29jJZgWqKUvk5UGFZgOeNPHtvMl+Bvr0Ltz95+JD9ld8eCPCkkWfvTSYrUOH6K08HkG7G2XvRCgVyEwMsYLrZe90KBQJYwAtnrwIBDOGFs1eBAIbwwtmrQABDeOHsVSCAIbxw9ioQwBBeOHuHLhDA24wwey/toYUCAQxkhNl7aQ8tBi0QAM0UKEKBADIoUIQCAWRQoAgFAsigQBEKBJBBgSIUCCCDAkUoEEAGBYpQIIAMChShQAAZFChCgQAyKFCEAgFkUKAIBQLIoEARCgSQQYEiFAgggwJFKBBABgWKUCCADAoUoUAAGRQoQoEAMihQhAIBZFCgCAUCyKBAEf//LTgcDofj+eMCBXI4HA7HheOCJQoEwIQUCIAcCgRADgUCIIcCAZBDgQDIoUAA5FAgAHIoEAA5FAiAHAoEQA4FAiCHAgGQQ4EAyKFAAOR4eP7/D8LUkIdEQ9M+AAAAAElFTkSuQmCC" alt="" width="428" height="240" />
      $("span").parents().css({"color":"red","border":"2px solid red"});
             aaarticlea/png;base64,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" alt="" width="550" height="196" />

$("span").parents("ul").css({"color":"red","border":"2px solid red"});

aaarticlea/png;base64,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" alt="" width="452" height="184" />

$("span").parentsUntil("div").css({"color":"red","border":"2px solid red"});

aaarticlea/png;base64,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" alt="" width="380" height="139" />

②子孙

向下遍历 DOM 树

下面是两个用于向下遍历 DOM 树的 jQuery 方法：

  • children()  方法返回被选元素的所有直接子元素。
  • find()    方法返回被选元素的后代元素，一路向下直到最后一个后代

实例 ：

  $("div").children().css({"color":"red","border":"2px solid red"});

aaarticlea/png;base64,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" alt="" width="355" height="158" />

$("div").find("span").css({"color":"red","border":"2px solid red"});

aaarticlea/png;base64,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" alt="" width="401" height="173" />

③同胞

在 DOM 树中水平遍历

有许多有用的方法让我们在 DOM 树进行水平遍历：

  • siblings()   方法返回被选元素的所有同胞元素
  • next()     方法返回被选元素的下一个同胞元素
  • nextAll()   方法返回被选元素的所有跟随的同胞元素
  • nextUntil()  方法返回介于两个给定参数之间的所有跟随的同胞元素。
  • prev()     工作方式与上面的方法类似，只不过方向相反
  • prevAll()
  • prevUntil()

实例:

$("h2").siblings().css({"color":"red","border":"2px solid red"});

aaarticlea/png;base64,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" alt="" width="449" height="157" />

$("h2").nextAll().css({"color":"red","border":"2px solid red"});

aaarticlea/png;base64,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" alt="" width="496" height="178" />

$("h2").nextUntil("h6").css({"color":"red","border":"2px solid red"});

aaarticlea/png;base64,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" alt="" width="454" height="224" />

④过滤

first() 方法返回被选元素的首个元素。

last() 方法返回被选元素的最后一个元素

eq() 方法返回被选元素中带有指定索引号的元素。 索引号从 0 开始，因此首个元素的索引号是 0 而不是 1

filter() 方法允许您规定一个标准。不匹配这个标准的元素会被从集合中删除，匹配的元素会被返回

not() 方法返回不匹配标准的所有元素。

实例：

$("p").eq(1);

  $("div p").first().css("background-color","yellow");

aaarticlea/png;base64,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" alt="" />

$("p").filter(".intro").css("background-color","yellow");  //class='intro'

aaarticlea/png;base64,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" alt="" />

16.  ajax

①  load() 方法从服务器加载数据，并把返回的数据放入被选元素中

    $(selector).load(URL,data,callback);

必需的 URL 参数规定您希望加载的 URL。

可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。

可选的 callback 参数是 load() 方法完成后所执行的函数名称。

回调函数可以设置不同的参数：

  •  responseTxt - 包含调用成功时的结果内容
  • statusTXT - 包含调用的状态
  • xhr - 包含 XMLHttpRequest 对象

下面的例子会在 load() 方法完成后显示一个提示框。如果 load() 方法已成功，则显示“外部内容加载成功！”，而如果失败，则显示错误消息：

实例：

$("button").click(function(){
          $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){
             if(statusTxt=="success")
                 alert("外部内容加载成功！");
            if(statusTxt=="error")
              alert("Error: "+xhr.status+": "+xhr.statusText);
           });
         });

②$.get() 方法通过 HTTP GET 请求从服务器上请求数据。

实例：http://www.w3school.com.cn/tiy/t.asp?f=jquery_ajax_get

$("button").click(function(){
        $.get("demo_test.asp",function(data,status){
        alert("Data: " + data + "\nStatus: " + status);
        });
     });

③$.post() 方法通过 HTTP POST 请求从服务器上请求数据。

  $.post(URL,data,callback);

必需的 URL 参数规定您希望请求的 URL。

可选的 data 参数规定连同请求发送的数据。

可选的 callback 参数是请求成功后所执行的函数名。

下面的例子使用 $.post() 连同请求一起发送数据：

实例

$("button").click(function(){

  $.post("demo_test_post.asp",

  {

    name:"Donald Duck",

    city:"Duckburg"

  },

  function(data,status){

    alert("Data: " + data + "\nStatus: " + status);

  });

});

17 jQuery noConflict() 方法

其他一些 JavaScript 框架包括：MooTools、Backbone、Sammy、Cappuccino、Knockout、JavaScript MVC、Google Web Toolkit、Google        Closure、Ember、Batman 以及 Ext JS。

其中某些框架也使用 $ 符号作为简写（就像 jQuery），如果您在用的两种不同的框架正在使用相同的简写符号，有可能导致脚本停止运行。

jQuery 的团队考虑到了这个问题，并实现了 noConflict() 方法

  noConflict() 方法会释放会 $ 标识符的控制
实例1：
您仍然可以通过全名替代简写的方式来使用 jQuery
$.noConflict();
jQuery(document).ready(function(){
  jQuery("button").click(function(){
    jQuery("p").text("jQuery 仍在运行！");
  });
});
实例2：

您也可以创建自己的简写。noConflict() 可返回对 jQuery 的引用，您可以把它存入变量，以供稍后使用。请看这个例子：

var jq = $.noConflict();

jq(document).ready(function(){

  jq("button").click(function(){

    jq("p").text("jQuery 仍在运行！");

  });

});

实例3：

如果你的 jQuery 代码块使用 $ 简写，并且您不愿意改变这个快捷方式，那么您可以把 $ 符号作为变量传递给 ready 方法。这样就可以在函数内使用 $ 符号了 - 而在函数外，依旧不得不使用 "jQuery"：

$.noConflict();

jQuery(document).ready(function($){

  $("button").click(function(){

    $("p").text("jQuery 仍在运行！");

  });

});

参考文献：http://www.w3school.com.cn/jquery/jquery_selectors.asp

好好学习哟！

相关文章