wrap(),wrapAll(),wrapInner()三者的区别

撑起自己半边天

于 2020-11-25 14:42:02 发布

阅读量648

点赞数 1

分类专栏： html jq 文章标签： html jquery javascript

本文链接：https://blog.csdn.net/weixin_43840289/article/details/110127393

版权

jq 同时被 2 个专栏收录

16 篇文章 0 订阅

订阅专栏

html

8 篇文章 0 订阅

订阅专栏

wrap(),wrapAll(),wrapInner()三者的区别

wrap(),wrapAll()这两者都是将选中标签从外部包围，而wrapInner()则是包围选中标签的内部所有，详细例子如下：

wrap()是单独包围，代码以及结果如下：

<div id="demo">
			<p>111</p>
			<p>222</p>
			<p>333</p>
			<p>444</p>
			<p>555</p>
		</div>
		
		<script type="text/javascript">
			$("#demo p").wrap('<div class="demo1">')
		</script>

在这里插入图片描述

wrapAll()是将选中的所有标签包围在一起，例子如下：

<div id="demo">
			<span>这是span标签</span>
			<p>这是p标签</p>
			<span>这是span标签</span>
			<span>这是span标签</span>
			<span>这是span标签</span>
			<p>这是p标签</p>
			<p>这是p标签</p>
			<span>这是span标签</span>
			<span>这是span标签</span>
		</div>
		
		<script type="text/javascript">
			$("#demo p").wrapAll('<div class="demo1">')
			
		</script>

在这里插入图片描述
wrapInner()是包围选中标签内的所有内容，例子如下：

<div id="demo">
			<span>这是span标签</span>
			<h1>这是h1标签</h1>
			<div>这是div标签</div>
			<p>这是p标签</p>
			<i>这是i标签</i>
			<small>这是small标签</small>
		</div>
		
		<script type="text/javascript">
			$("#demo").wrapInner('<div class="demo1">')
		</script>