JQuery中DOM操作之wrap的使用方法

發(fā)布時間：2021-01-27 15:16:40 來源：億速云閱讀：234 作者：小新欄目：web開發(fā)

小編給大家分享一下JQuery中DOM操作之wrap的使用方法，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

wrap：包裹，用法為$(a).wrap(（b）); 把a用b包裹起來(每個元素都會包裹)

如：body中有三個p

	<p>p1</p>
	<p>p2</p>
	<p>p3</p>

現(xiàn)在對p進(jìn)行包裹操作：

$("p").wrap("<p></p>");

對應(yīng)的輸出為

JQuery中DOM操作之wrap的使用方法

unwrap：取消包裹

例如現(xiàn)在對上面的三個p進(jìn)行取消包裹操作：

$("p").unwrap();

JQuery中DOM操作之wrap的使用方法

wrapAll：把所有的元素都包裹起來（所有元素都會被一個包裹）

例如：對上述的三個p進(jìn)行wrapAll操作

$("p").wrapAll("<p></p>");

看輸出為：

JQuery中DOM操作之wrap的使用方法

wrapInner：內(nèi)部包裹

這是在元素內(nèi)部的下一級重建一個新的元素，把父元素的所有內(nèi)容進(jìn)行包裹；直接看實例：

現(xiàn)在有一個p內(nèi)部有內(nèi)容，有元素；

<p>p1 <a href="" title="">連接</a></p>

我們對它進(jìn)行wrapInner操作：

$("p").wrapInner('<p></p>');

輸出為：

JQuery中DOM操作之wrap的使用方法

如此看來，jquery中inner操作就很清晰了。

以上是“JQuery中DOM操作之wrap的使用方法”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注億速云行業(yè)資訊頻道！

向AI問一下細(xì)節(jié)

猜你喜歡