JQuery操作文档之包裹节点

如果要将某个节点用其他标记包裹起来，JQuery提供了三个方法：wrap()、wrapAll()、wrapInner(),这三个方法对于需要在文档中插入额外的结构化标记非常有用，而且它不会破坏原始文档的语义。

1.wrap()方法

将所有匹配元素用指定元素来包裹，所不同的是：它会将所有匹配元素进行单独的包裹。如：

HTML：

<p>Hello</p>

<p>Hello</p>

JQuery代码：$(“p”).wrap(“<b></b>”);

结果：

<b><p>Hello</p></b>

<b><p>Hello</p></b>

2.wrapAll()方法

这个方法也是将所有匹配元素用指定元素来包裹，所不同的是：它会将所有匹配元素用一个元素来包裹。如：

HTML：

<p>Hello</p>

<p>Hello</p>

JQuery代码：$(“p”).wrapAll(“<b></b>”);

结果：

<b>

<p>Hello</p>

<p>Hello</p>

</b>

3.wrapInner()方法

该方法将每一个匹配元素的子内容(包括文本节点)用其他结构化的标记包裹起来。如：

HTML：

<p>Hello</p>

<p>Hello</p>

JQuery代码：$(“p”). wrapInner(“<b></b>”);

结果：

<p><b>Hello</b></p>

<p><b>Hello</b></p>