二、jquery

一、选择器

1、基本选择器

ID选择器　　　　$("#id");　

类选择器　　　　$(".class");  

元素选择器          $("div"); 

匹配所有              $("*");                                            

合集选择器           $("#id , .class , div ");  

2、层级选择器

○ 后代选择器（不仅选择儿子，孙子也不放过）　　　　　　     $("body div");

○ 子代选择器（只选择儿子）                                                    $("body >div");

○ 下一个兄弟选择器（只选择下一个【同辈】元素）                  $("div + div");

○ 后面的所有兄弟选择器（选择自己后面所有的【同辈元素】）  $("prev ~ siblings");

3、过滤选择器

○ 选取集合元素中的第一个                                                    $(".class:first");

○ 选取集合元素最后一个元素                                                 $ (".class:last");

○ 改变集合中部位某个特征的其余元素                                   $("div:not('.one')");

○ 选择索引为偶数的集合                                                         $(".class:even")     even 是偶数的意思。可以音译为伊文，女孩子名字。默认索引是从0开始。

○ 选择索引为奇数的集合                                                         $(".class:odd")      odd  是奇数，奇怪的人的意思。奇怪的人都是单身狗，dog odd。索引从0始

○ 选择索引值等于 n 的元素                                                     $(".class:eq(5)");    选择.class中索引值等于5的那个元素。索引从0开始。

○ 选择索引值大于 n 的元素                                                     $(".class:gt(5)");     选择.class中索引值大于5的元素。索引从0开始。

○ 选择索引值小于 n 的元素                                                     $(".class:lt(5)");       选择.class中索引值小于5的元素。索引从0开始。

○ 选择标题元素如h1----h6                                                       $(":header")；

○ 选择页面中正在执行动画的元素                                            $("animated")         animated   动画的。

○ 选择页面中当前获取焦点的元素                                            $(":focus")               focus  关注。

4、内容过滤选择器：

○ 内容选择过滤器　　　　              $("div:contains('text')");   内容为'text'的那个div

○ 不包含子元素也不包含文本元素   $("div:empty");

○ 含有选择器所匹配元素的元素       $("div:has(p)");                元素里面有<p>的那个div

○ 含有子元素和文本元素的元素        $("div:parent");                和$("div:empty")正好相反，对比记忆。

5、可见性过滤选择器：

○ 页面中隐藏元素选择器　　　　　　　　　　　　　　  $("div:hidden");

○ 页面中可视元素选择器                                         $("div:visible");

6、属性过滤选择器：

○ 有某个属性的选择器                                           $("div[title]")                 选择有属性为title的div。

○ 属性值等某个值的。                                           $("div[title = 'bigBreast']")  选择title值等于bigBreast（大胸）的那个div。

○ 属性值不等于某个值的。                                     $("div[title != 'bigBreast']") 选择title值不等于bigBreast（大胸）的那个div。

○ 属性值以什么开头的。                                        $("div[title ^= 'mengmengda']") 选择title值以mengmengda开头的那个div。

○ 属性值以什么结尾的。                                        $("div[title $= 'mengmengda']") 选择title值以mengmengda结尾的那个div。

○ 属性值中含有什么文字的。                                   $("div[title *= 'hexie']");              选择title值里面含有hexie（和谐内容）的那个div。

○ 属性中不仅含有这个属性而且含有其他属性。（超级组合啊）$("div[id][title][test]");      寻找属性中不仅有id而且有title而且属性为test的。

7、子元素过滤选择器：

○ 选择某个集合元素中，第几个子元素。                      $("div.small :nth-child(2)");   

○ 选择某个集合元素下，第一个子元素。                      $("div.small :first-child");      

○ 选择某个集合元素下，最后一个子元素。                   $("div.small :last-child");

○ 选择某个集合下，子元素是3的倍数的子元素。           $("div.small :nth-child(3n)");

○ 选择某个集合下，子元素是3的倍数加以的子元素        $("div.small :nth-child(3n+1)"); 

○ 选择某个集合下，并且只有一个子元素的的元素          $("div.small :only_child");

8、表单对象过滤选择器：

○ 选取所有可用的元素　　　　　　　　　　               $("#form :enabled");

○ 选取所有不可用的元素                                        $("#form :disabled");

○ 选取所有单选框或复选框中被选中的的元素               $("#from :checked");

○ 选取所有下拉列表中被选中的选项元素。                  $("#from :selected");

9、表单选择器：

○ 选取表单中所有的input、textarea 、select 、button 元素                   $("#form :input");

○ 选取所有的单行文本框                                                                   $("#form :text");

○ 选取表单中所有的密码框                                                                $("#form :password");

○ 选取所有的单选框                                                                         $("#form :radio");

○ 选取所有的多选框                                                                         $("#form :submit");

○ 选取所有的提交按钮                                                                      $("#form :submit");

○ 选取所有的图像按钮                                                                      $("#form :image");

○ 选取所有的重置按钮                                                                      $("#form :reset");

○ 选取所有的按钮                                                                            $("#form :button");

○ 选取所有的上传域                                                                         $("#form :file");

○ 选取所有的不可见元素                                                                   $("#form :hidden");

 二、1、删除节点：

如果文档中一个元素多余，那么就需要删除掉。jQuery提供了三种删除节点的方法。分别是remove()   、  detach()    、   empty()；

remove()   和   detach()的共同点都是可以删除节点。更更严谨更科学的说法就是【剪切】，并没有真正的删除掉元素，这些元素还可以重新插入到其他的地方。

不同点在于，remove() 【剪切】节点后，该节点上绑定的事件同时也被销毁，但是detach()  所【剪切】的节点上所绑定的事件都能够保留。

empty() 并不是删除，只清楚元素的内容。相当于把contains中内容替换成了null。

        2、复制节点（克隆节点）：

 clone(boolean) 

clone的boolean默认是false。克隆节点的时候，该元素的所绑定的事件对象将不克隆，只克隆节点本身。

clone的boolean可以设置为true，克隆的时候，该元素所绑定的事件对象，将会被带到克隆的副本上去，同等具有原节点的功能。

        3、  替换节点：

   replaceWith  与  replaceAll

$('A').replaceWith('B')   把A替换成B；

 $('A').replaceAll('B')      把B替换成A；

        4、 包裹节点：

wrapInner

wrap

wrapAll