[attribute1]
[attribute2]
... 用属性选择器合并成复合选择器，满足多个条件，缩小范围 集合元素 $("div[id][title$="test"]")选取拥有属性
id并且属性title以"test"结束的div元素

  子元素过滤选择器

选择器 描述 返回 示例

:nth-child(index/even
/odd/equatioin) 选取每个父元素下第index个子元素或奇偶元素，
index从1开始 集合元素 将为每一个父元素匹配子元素

:first-child 选取每个父元素的第一个子元素 集合元素 将为每一个父元素匹配子元素

:last-child 选取每个父元素的最后一个子元素 集合元素 将为每一个父元素匹配子元素

:only-child 若某个元素是其父元素唯一的子元素，则被匹配 集合元素 $("ul li:only-child")在<ul>中选取是唯一
子元素的<li>元素

:nth-child()选择器功能如下： 1、:nth-child(even)选择索引是偶数的元素 2、:nth-child(2)选择索引是2的元素 3、:nth-child(3n+1)选择索引是（3n+1）的元素，n从1开始 表单对象属性过滤选择器

选择器 描述 返回 示例

:enabled 选取所有可用元素 集合元素 $("#form1 :enabled")

:disabled 选取所有不可用元素 集合元素 $("#form1 :disabled")

:checked 选取所有被选中元素，单选，复选 集合元素 $("input:checked")

:selected 选取所有被选中选项元素，下来列表 集合元素 $("select option:selected")

:input 选取所有<input><textarea><select><button> 集合元素 $(":input")

:text 选取所有单行文本框 集合元素 $(":text")

:password 选取所有密码框 集合元素 $(":password")

:radio 选取所有单选框 集合元素 $(":radio")

:checkbox 选取所有复选框 集合元素 $(":checkbox")

:submit 选取所有提交按钮 集合元素 $(":submit")

:image 选取所有图像按钮 集合元素 $(":image")

:reset 选取重置按钮 集合元素 $(":reset")

:button 选取所有按钮 集合元素 $(":button")

:file 选取所有上传域 集合元素 $(":file")

:hidden 选取所有不可见元素 集合元素 $(":hidden")

选择器中的注意事项 1、选择器中含有"."，"#"，"("，"]"等特殊符号，需要转义，例：$("#id\\#b") 2、属性选择器中的@符号需要去掉 第3章，jQuery中的DOM操作 DOM操作分类 1、DOM Core（核心） 2、HTML-DOM 3、CSS-DOM jQuery中的DOM操作 1、查找节点 （1）查找元素节点，使用选择器 （2）查找属性节点，再找到元素之后，可以使用attr()方法获取元素属性 2、创建节点 （1）创建元素节点 使用工厂函数$()来完成，$(html)，根据传入的HTML标记字符串，创建一个DOM对象，并转成jQuery对象返回 例：$("<li></li>") （2）创建文本节点，与（1）类似，将文本内容一起包含在HTML标记字符串中 （3）创建属性节点，与（1）类似，将节点属性一起包含在HTML标记字符串中 3、插入节点

方法 描述 示例

append() 向每个匹配的元素内部追加内容 <p>我想说：</p>
$("p").append("<b>你好</b>");
<p>我想说：<b>你好</b></p>

appendTo() 将所有匹配元素追加到指定元素中，与append方法颠倒 <p>我想说：</p>
$("<b>你好</b>").appendTo("p");
<p>我想说：<b>你好</b></p>

prepend() 向每个元素内部前置内容 <p>我想说：</p>
$("p").prepend("<b>你好</b>");
<p><b>你好</b>我想说：</p>

prependTo() 将所有匹配元素前置到指定元素中，与prependTo方法颠倒 <p>我想说：</p>
$("p").prependTo("<b>你好</b>");
<p><b>你好</b>我想说：</p>

after() 在每个匹配元素之后插入内容 <p>我想说：</p>
$("p").after("<b>你好</b>");
<p>我想说：</p><b>你好</b>

insertAfter() 将所有匹配元素插入到指定元素之后 <p>我想说：</p>
$("<b>你好</b>  ").insertAfter("p");
<p>我想说：</p><b>你好</b>

before() 在每个匹配的元素之前插入内容 <p>我想说：</p>
$("p").before("<b>你好</b>");
<b>你好</b> <p>我想说：</p>

insertBefore() 将所有匹配元素插入到指定元素之前 <p>我想说：</p>
$("<b>你好</b>  ").insertBefore("p");
<b>你好</b> <p>我想说：</p>

这些方法不只能将新建节点插入到文档中，也能移动原有节点 4、删除节点 （1）remove方法 删除节点，及所有后代节点，并清除绑定的事件、附加的数据，返回被删除节点的引用，在之后可以继续使用 $("ul li:eq(1)").remove(); 也可以通过传递参数来选择性删除： $("ul li").remove("li[title!=test]"); （2）datach方法 与remove一样，但不会清除绑定的事件、附加的数据 （3）empty方法 并不能算是删除节点，而是清空节点，清空指定元素的所有后代节点 5、复制节点 使用clone方法，使用参数true可以同时复制元素所绑定事件 6、替换节点 replaceWith()和replaceAll() $("p").replaceWith("<strong>hello</strong>"); $("<strong>hello</strong>").replaceAll("p"); 以上两句是一样的效果 注：元素绑定事件一样会被清掉 7、包裹节点 使用wrap()方法 hello $("strong").wrap("<b></b>"); //用b标签把strong元素包裹起来 hello wrapAll()和wrapInner() （1）wrapAll 将所有匹配元素用一个元素来包裹，与wrap不同，wrap是将所有匹配元素单独包裹： hellohello $("strong").wrap("<b></b>"); hellohello 而使用wrapAll之后： hellohello 注：若被包裹元素之间有其他元素，则其他元素会被放到包裹元素之后 （2）wrapInner方法 该方法将每一个匹配的元素的子内容用其他结构化标记包裹起来： hello $("strong").wrapInner("<b></b>"); hello 8、属性操作 （1）获取和设置属性 使用attr()方法 获取属性 var $p = $("p"); var p_txt = $p.attr("title"); 设置属性 $("p").attr("title","value"); //用于设置单个属性 $("p").attr({"title":"you title","name":"you name"}); //用于设置多个属性，使用对象传递 （2）删除属性 使用removeAttr()方法 $("p").removeAttr("title"); 9、样式操作 （1）获取和设置样式 使用attr()方法 （2）追加样式 使用addClass()方法 $("p").addClass("another"); （3）移除样式 使用removeClass 参数为要移除的class名，不带参数则把所有class移除 （4）切换样式 toggle()方法 $toggleBtn.toggle(function(){ //代码1 },function(){ //代码2 }); toggle的作用是，交替执行代码1和代码2，主要是用于控制行为上的重复切换 toggleClass()方法 用于控制样式上的切换，类名存在则删除，不存在则添加 $("p").toggleClass("another"); （5）判断是否含有某个样式 hasClass()方法用于判断是否含有某个class，有返回true，没有返回false 10、设置和获取HTML、文本和值 （1）html()方法，可用于XHTML，不可用于XML 类似于JavaScript的innerHTML属性，可以用于获取和设置元素（传递参数）的HTML内容 （2）text()方法 类似于JavaScript的innerText属性，用于获取和设置元素（传递参数）的文本内容 （3）val()方法 类似于JavaScript的value属性，用于设置和获取元素的值，无论元素是文本框，下来列表还是单选框，都可以返回元素值，若为多选，返回一个包含所有选择的值的数组 11、遍历节点 （1）children()方法 取得匹配元素的子元素集合，只考虑子元素，不考虑后代元素，$("p").children(); （2）next()方法 用于取得匹配元素后面紧邻的同辈元素，$("p").next(); （3）prev()方法 用于取得匹配元素前面紧邻的同辈元素，$("p").prev(); （4）siblings()方法 用于取得匹配元素前后所有同辈元素，$("p").siblings(); （5）closest()方法 该方法用于取得最近的匹配元素。首先检查元素本身，接着逐级向上往祖先元素查找，没找到则返回空jQuery对象 （6）parent()，parents()，closest()区别 parent()，获取集合中每个匹配元素的父元素 parents()，获取集合中每个匹配元素的祖先元素 closese()，从元素本身开始，逐级向上级元素匹配，并返回最先匹配的祖先元素 12、CSS-DOM操作 可以直接利用css()方法获取元素的样式属性：$("p").css("color"); 无论是外部CSS导入，还是直接拼接在HTML元素中，都可以通过css()方法获得 设置样式与attr()方法类似 $("p").css("color","red"); //设置单个 $("p").css({"color":"red","fontSize":"30px"); //设置多个 注：如果值是数字，则自动转化为像素值 获取元素高度，可以直接使用height属性 $("p").height(); 注：1、jQuery1.2之后height可用于获取window和document的高度         2、css方法获取的高度值与样式设置有关，而height获取的是元素在页面实际高度，与样式设置无关，且不带单位 与height对应的还有width()方法 其他几个经常使用的方法： （1）offset()方法 用于获取元素在当前视窗的相对偏移，返回对象包含两个属性，top，left，只对可见元素有效 （2）position()方法 用于获取元素相对于最近一个position样式属性设置为relative或absolute的祖先节点的相对偏移，返回对象也包含连个属性top，left （3）scrollTop()方法和scrollLeft()方法 分别用于获取元素的滚动条距顶端和距左侧的距离，还可以接受一个参数，指定滚动条滚动到指定位置