【JQuery】使用wrap()和wrapInner()方法包裹元素和内容

最新推荐文章于 2021-03-31 21:00:16 发布

badlyForPapers

最新推荐文章于 2021-03-31 21:00:16 发布

阅读量1k

点赞数

分类专栏： jQuery

本文链接：https://blog.csdn.net/happyhaojie/article/details/51042952

版权

jQuery 专栏收录该内容

73 篇文章 0 订阅

订阅专栏

wrap()和wrapInner()方法都可以进行元素的包裹.

但wrap()用于包裹元素本身，wrapInner()则用于包裹元素中的内容，它们的调用格式分别为：

$(selector).wrap(wrapper)和$(selector).wrapInner(wrapper)

参数selector为被包裹的元素，wrapper参数为包裹元素的格式。

区别是什么呢？打个比方。

warp()是将一个标签包裹进另一个标签，这句话的意思就是把一个标签放到另一个标签里面，例如：<li>123<li>用<div></div>包裹，结果是这样<div><li>123</li></div>，是外包裹。

而warpInner是包裹元素内的内容，就是将本来<li>123</li>中的内容123用<div></div>进行了包裹，变成了<li><div>123</div></li>，是内包裹。

<body>
        <h3>使用wrapInner()方法包裹元素</h3>
        <span class="red" title='hi'>我的身体有点歪</span>
        
        <script type="text/javascript">
            $(".red").wrapInner("<i></i>");
            $(".red").wrap("<div></div>");
        </script>
    </body>

结果：