jQuery内容整理——DOM操作

class属性

.addClass(className/function(index,currentClass)):为每个匹配的元素添加指定的样式类名;
.hasClass(className)如果匹配元素上有指定的样式，那么.hasClass()方法将返回true;
.removeClass(className/function(index,class))除集合中每个匹配元素上一个，多个或全部(多个用空格隔开)样式。
.toggleClass()在匹配的元素集合中,如果存在（不存在）就删除（添加）一个类。

复制元素

.clone()复制一个匹配的元素集合的副本。复制所有匹配的元素集合，包括所有匹配元素、匹配元素的下级元素、文字节点。
注：使用.clone()可能产生id属性重复的元素的副作用，id应该是唯一的。

内部插入

HTML代码：

你好

1. append 向每个匹配的元素内部追加内容。
   $("p").append("Hello")---

   你好Hello

2. appendTo 与append相反
   $("Hello").appendTo("p")---

   你好Hello

3. prepend 插入到目标元素内部前端
   $("p").prepend ("Hello")---

   Hello你好

4. prependTo 与prepend 相反
   $("Hello").prependTo ("p")---

   Hello你好

外部插入

HTML代码:Hello

I say:

1. after() 在每个匹配的元素之后插入内容。
   $('p').after($('b'))---

   I say:

   Hello
2. before()在每个匹配的元素之前插入内容
   $('p').before($('b'))---Hello

   I say:

3. insertAfter() 与after相反
4. insertBefore() 与before相反

替换

1. replaceWith()将所有匹配的元素替换成指定的HTML或DOM元素。(如果是文档中的内容去替换别的内容，文档中的内容是移动到目标区域替换而不是复制一份去替换)例如:

     
Hello
     
And
     
Goodbye

$('.third').replaceWith($('.first'));
====>

     
And
     
Hello

```
2. replaceAll()用匹配的元素替换掉所有 selector匹配到的元素。

Hello

cruel

World

$(’你好').replaceAll('p');
结果：你好你好你好

#####包裹
1. wrap()匹配的元素用其他元素的结构化标记包裹起来
`$("p").wrap("
");`
原先div的内容作为新div的class，并将每一个元素包裹起来

Hello

Goodbye

$('.inner').wrap(function() {
return '

';
});

Hello

Goodbye

2. unwrap() 移出元素的父元素
3. wrapAll()将所有匹配的元素用单个元素包裹起来
4. wrapInner()将每一个匹配的元素单独用一个元素包裹起来

#####删除
1. empty()删除匹配的元素集合中所有的子节点。
`$('
你好
').empty();`
`
`
2. remove() 在DOM中删除所有匹配的元素。$('p').remove('.red')
注：这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。但除了这个元素本身得以保留之外，其他的比如绑定的事件，附加的数据等都会被移除。
3. detach()  与remove()类似
注：这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。与remove()不同的是，所有绑定的事件、附加的数据等都会保留下来。