为什么元素会被移动呢？
来源：3-1 zepto中的DOM操作
李知恩
2021-03-30 23:44:26
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>zepto中的DOM操作</title>
</head>
<body>
<div id="a">
<div class="a_one">a_one</div>
</div>
<ul>
<li>
<span>删除</span>
<p>藏起来</p>
</li>
</ul>
<p>李知恩</p>
<p>李知恩</p>
<script type="text/javascript" src="../../lib/zepto.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//js代码
//插入操作
var $cr = $("<div class='cr'> 插入的div </div>");
//$('#a').append($cr);//---从后面插入子元素
//$cr.appendTo($('#a'));//---从后面插入子元素
//$('#a').prepend($cr);//---从前面插入子元素
//$cr.prependTo($('#a'));//---从前面插入子元素
//$('#a').after($cr);//---在后面插入一个兄弟元素
//$cr.insertAfter($('#a'));//---在后面插入一个兄弟元素
//$('#a').before($cr);//---在前面插入一个兄弟元素
//$cr.insertBefore($('#a'));//---在前面插入一个兄弟元素
//删除操作 remove/empty
//$('ul li').remove();//删除li元素及其子元素
//$('ul li').empty();//删除li的所有子元素
//复制节点
/* $('ul li').click(function(){
$(this).clone().appendTo($('ul'));
}) */
//替换节点 replaceWith
//$('p').replaceWith("<span>刘亦菲</span>");
//包裹节点
//$('p').wrap("<div></div>");
$('p').wrapAll("<div></div>");
})
</script>
</body>
</html>
1回答
-
同学你好，因为wrapAll方法会将所有符合条件的标签，都移动到第一个符合条件的标签的后面，然后使用指定的标签包裹起来。元素会被移动是这个方法的特点，特殊记忆下即可。
同学代码中，第一个符合条件的p标签在li标签中，所以会将其他的p标签放在这个p标签后面，然后使用div标签包裹他们。
祝学习愉快~
0
相似问题