创建节点和属性处理:

var div=$("<div class='right'><div class='aaron'>动态创建Div元素节点</div></div>")

插入文档：

var $body=$('body');

$body.append(div);

这里总结下内部操作四个方法的区别：

• append()向每个匹配的元素内部追加内容

• prepend()向每个匹配的元素内部前置内容

• appendTo()把所有匹配的元素追加到另一个指定元素的集合中

• prependTo()把所有匹配的元素前置到另一个指定的元素集合中

append 在元素结尾插入内容

元素添加事件 addEventListener();

创建元素 document.createElement('');

元素设置属性 setAttribute();

元素设置属性2 classname='';

在元素中添加元素 appendChild()

DOM节点删除中detach（）和remove（）的区别：

Query中wrap、wrapAll和wrapInner用法以及区别 <ul>  <li title='苹果'>苹果</li>  <li title='橘子'>橘子</li>  <li title='菠萝'>菠萝</li> </ul> 1、$("li").wrap("<div></div>"); 每一个选择器都添加 <ul>  <div><li title="苹果">苹果</li></div>  <div><li title="橘子">橘子</li></div>  <div><li title="菠萝">菠萝</li></div> </ul> 2、$("li").wrapAll("<div></div>"); 在所有选中的选择器最外面添加 <ul>  <div>    <li title="苹果">苹果</li>    <li title="橘子">橘子</li>    <li title="菠萝">菠萝</li>  </div> </ul> 3、$("li").wrapInner("<div></div>"); 为选择器的内容添加 <ul>  <li title='苹果'><div>苹果</div></li>  <li title='橘子'>><div>橘子</div></li>  <li title='菠萝'>><div>菠萝</div></li> </ul>

remove：移除节点

• 无参数，移除自身整个节点以及该节点的内部的所有节点，包括节点上事件与数据

• 有参数，移除筛选出的节点以及该节点的内部的所有节点，包括节点上事件与数据

detach：移除节点

• 移除的处理与remove一致

• 与remove()不同的是，所有绑定的事件、附加的数据等都会保留下来

• 例如：$("p").detach()这一句会移除对象，仅仅是显示效果没有了。但是内存中还是存在的。当你append之后，又重新回到了文档流中。就又显示出来了。

empty方法

• 严格地讲，empty()方法并不是删除节点，而是清空节点，它能清空元素中的所有后代节点

• empty不能删除自己本身这个节点

remove方法

• 该节点与该节点所包含的所有后代节点将同时被删除

• 提供传递一个筛选的表达式，删除指定合集中的元素

转：

(A).after(B,C); //紧接着A元素后面追加兄弟元素B,C------支持多参数，追加B,C (A).before(B,C); //紧接着A元素前面追加兄弟元素B,C------支持多参数，追加B,C (A).insertBefore(B,C); //紧接着A元素前面追加兄弟元素B,C------不支持多参数，追加第一个参数B (A).insertAfter(B,C); //紧接着A元素后面追加兄弟元素B,C------不支持多参数，追加第一个参数B (A).append(B，C); //在A的最后追加一个子元素B和C------支持多参数，追加B,C (B,C).appendTo(A); //把B作为子元素追加在A的最后------不支持多参数，追加第一个参数B (A).prepend(B,C); //向A内部前置子元素B,C------支持多参数，前置B,C (B,C)prependTo(A); //把B作为子元素前置到A内部------不支持多参数，前置第一个参数B

.each() 方法就是一个for循环的迭代器，它会迭代jQuery对象合集中的每一个DOM元素。每次回调函数执行时，会传递当前循环次数作为参数(从0开始计数

所以大体上了解3个重点：

each是一个for循环的包装迭代器
each通过回调的方式处理，并且会有2个固定的实参，索引与元素
each回调方法中的this指向当前迭代的dom元素

看一个简单的案例

<ul>
    <li>慕课网</li>
    <li>Aaron</li>
</ul>

开始迭代li，循环2次

$("li").each(function(index, element) {
     index 索引 0,1
     element是对应的li节点 li,li
     this 指向的是li
})

jQuery遍历之add()方法

/把p元素加到li合集中 ，开始我以为会变成<li><p></p></li>   这句话好容易让人理解错误啊。。  其实就是选择li的同时选择了P，给他们加同样的CSS

粗看.parents()和.closest()是有点相似的，都是往上遍历祖辈元素，但是两者还是有区别的，否则就没有存在的意义了

1. 起始位置不同：.closest开始于当前元素 .parents开始于父元素

2. 遍历的目标不同：.closest要找到指定的目标，.parents遍历到文档根元素，closest向上查找，直到找到一个匹配的就停止查找，parents一直查找到根元素，并将匹配的元素加入集合

3. 结果不同：.closest返回的是包含零个或一个元素的jquery对象，parents返回的是包含零个或一个或多个元素的jquery对象

jQuery遍历之parent()方法

jQuery是一个合集对象，如果想快速查找合集里面的每一个元素的父元素（这里可以理解为就是父亲-儿子的关系），此时可以用parent()方法

因为是父元素，这个方法只会向上查找一级

理解节点查找关系：

<div class="div">     <ul class="son">         <li class="grandson">1</li>     </ul> </div>

查找ul的父元素div, $(ul).parent()，就是这样简单的表达

parent()无参数

parent()方法允许我们能够在DOM树中搜索到这些元素的父级元素，从有序的向上匹配元素，并根据匹配的元素创建一个新的 jQuery 对象

注意：jQuery是一个合集对象，所以通过parent是匹配合集中每一个元素的父元素

parent()无参数

parent()方法允许我们能够在DOM树中搜索到这些元素的父级元素，从有序的向上匹配元素，并根据匹配的元素创建一个新的 jQuery 对象

注意：jQuery是一个合集对象，所以通过parent是匹配合集中每一个元素的父元素

parent()方法选择性地接受同一型选择器表达式

同样的也是因为jQuery是合集对象，可能需要对这个合集对象进行一定的筛选，找出目标元素，所以允许传一个选择器的表达式