Jquery进行文本处理时，总共分为6种模式：内部插入、外部插入、包裹、替换、删除、复制

今天开始学习Jquery文本处理，在使用Jquery进行文本处理时，总共分为6种模式：内部插入、外部插入、包裹、替换、删除、复制。下面我们对它进行一一分析。
1.内部插入：对匹配的对象元素进行内容的追加（内部）
关键字：append  appendTo   prepend  prependTo
append-->在匹配对象元素(后面)追加指定内容
格式：$("element").append("content")
格式解释：$("element")为选中的匹配对象元素，content为我们所要追加的内容
举例：html代码 -->

Jquery文本处理学习

   Jquery代码：$("p").append("大家好")
结果：

Jquery文本处理学习大家好

Jquery代码解释：$("p").append("大家好") 查找p标签，并把大家好插入到p标签内的后面

appendTo -->把所有匹配的元素追加到另一个指定的元素元素集合中
格式：$("element").appendTo("content")
格式解释：$("element")为选中的匹配对象元素，content为被追加的内容
举例：html代码 -->

我在学习Jquery

  Jquery代码：$("p").appendTo("div")
结果：

我在学习Jquery

Jquery代码解释：$("p").appendTo("div") 查找p标签，并把p标签的内容插入到div标签中

prepend -->在匹配对象元素(前面)追加指定内容
说明：此关键字与append关键字一样，所不同的是，它将内容插入到匹配对象元素内的前面。

prependTo -->把所有匹配的元素前置到另一个、指定的元素集合中。
说明：此关键字与appendTo关键字一样，所不同的是，它将匹配到的元素前置到另一个元素集合中。

2.外部插入：对匹配的对象元素进行内容的追加（外部）
关键字：after before inserAfter inserBefore
after -->在每个匹配的元素之后插入内容.
格式：$("element").after("content")
格式解释：$("element")为选中的匹配对象元素，content为我们所要追加的内容
举例：html代码 -->

大家好

Jquery代码：$("div").after("

我正在学习Jquery

")
结果：

大家好

我正在学习Jquery

Jquery代码解释：把

我正在学习Jquery

插入到每个div标签的后面，比较简单。

before -->在每个匹配的元素之前插入内容
说明：此关键字与after关键字一样，所不同的是，它将内容插入到了匹配对象元素的前边

inserAfter -->把所有匹配的元素插入到另一个、指定的元素元素集合的后面。
举例：html代码 -->

abc

我在学习Jquery

  Jquery代码：$("p").inserAfter("div")
结果：

abc

我在学习Jquery

Jquery代码解释：$("p").inserAfter("div") 查找p标签，并把p标签的内容插入到div标签后面

inserBefore -->把所有匹配的元素插入到另一个、指定的元素元素集合的前面。
举例：html代码 -->

abc

我在学习Jquery

  Jquery代码：$("p").inserBefore("div")
结果：

我在学习Jquery

abc

Jquery代码解释：$("p").inserAfter("div") 查找p标签，并把p标签的内容插入到div标签前面

3.包裹
关键字：wrap unwrap wrapAll wrapInner
wrap -->把所有匹配的元素用其他元素的结构化标记包裹起来。
说明：wrap有两种参数 1：html代表结构化html代码 2:elem选择器
举例1： html代码：

abc

我在学习Jquery

Jquery代码：$("p").wrap("

")
结果：

abc

我在学习Jquery

举例2：html代码:

abc

我在学习Jquery

Jquery代码：$("p").wrap($("#wrap"))
结果：

abc

abc

我在学习Jquery

unwrap -->移出元素的父元素
举例：html代码：

我在学习Jquery

Jquery代码：$("p").unwrap()
结果：

我在学习Jquery

wrapAll -->将所有匹配的元素用单个元素包裹起来
举例：html代码：

Hello

我在学习Jquery

       Jquery代码：$("p").wrapAll("

")
结果：

Hello

我在学习Jquery

举例2：html代码：

abc

Hello

我在学习Jquery

         Jquery代码：$("p").wrapAll($(".warp"))
结果：

abc

abc

Hello

我在学习Jquery

wrapInner -->将每一个匹配的元素的子内容(包括文本节点)用一个HTML结构包裹起来
举例：html代码：

Hello

cruel

World

Jquery代码：$("p").wrapInner("");
结果：

Hello

cruel

World

4.替换
关键字：replaceWith replaceAll
replaceWith -->将所有匹配的元素替换成指定的HTML或DOM元素。
举例：

Hello

cruel

World

Juqery代码：$("p").replaceWith("Paragraph. ");
结果：Paragraph. Paragraph. Paragraph.

replaceAll -->用匹配的元素替换掉所有 selector匹配到的元素。
举例：

Hello

cruel

World

Jquery代码：$("Paragraph. ").replaceAll("p");
结果：Paragraph. Paragraph. Paragraph.

replaceWith与replaceAll比较：replaceWith是先找匹配对象，再设置值，replaceAll是先设置值，再找匹配对象

5.删除
关键字：empty remove detach
empty -->删除匹配的元素集合中所有的子节点。
举例：

Hello, Person and person

Jquery代码：$("p").empty();
结果：

remove -->从DOM中删除所有匹配的元素。
举例：

Hello

how are

you

Jquery代码：$("p").remove();
结果：how are
说明：这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。但除了这个元素本身得以保留之外，其他的比如绑定的事件，附加的数据等都会被移除。

detach -->从DOM中删除所有匹配的元素。
举例：

Hello

how are

you

Jquery代码：$("p").detach(".hello");
结果：how are

you

说明：这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。与remove()不同的是，所有绑定的事件、附加的数据等都会保留下来。

6.复制
关键字：clone clone(true)
clone -->克隆匹配的DOM元素并且选中这些克隆的副本
举例：Hello

, how are you

   Jquery代码：$("b").clone().prependTo("p");
结果：Hello

Hello, how are you

clone(true) -->元素以及其所有的事件处理并且选中这些克隆的副本
举例：Clone Me!  Jquery代码：$("button").click(function(){
  $(this).clone(true).insertAfter(this);
});
结果：Clone Me!Clone Me!
说明：clone()方法是复制一个元素，不包含其所有事件，
          clone(true)方是复制一个元素及其所有事件