您的位置：首页 > Web前端 > JQuery

jQuery之内部插入易混淆方法解析

2017-11-12 18:37 239 查看
jquery的内部插入：

一.append（）：向每个匹配的元素内部追加内容。可以追加自定义内容，也可以追加页面匹配内容。

appendTo（）：把所有匹配的元素追加到另一个指定的元素元素集合中。把所有匹配的元素追加到另一个指定的元素元素集合中。

下面来看代码：

1.append（）：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p>桃子</p>
<p>影子</p>
<span>嗨</span>
</body>
<script src="../../jQuery2/jquery-3.1.1.js"></script>
<script>
/*追加自己定义的内容*/
($("p").append("<span>影子</span>"));
/*追加页面内容，移动追加*/
$("p").append($("span"));

</script>
</html>

2.appendTo（）：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p>吉瑞教育</p>
<div>div1</div>
<div>div2</div>
</body>
<script src="../../jQuery2/jquery-3.1.1.js"></script>
<script>
/*追加页面所有匹配内容 ，移动追加*/
$("p").appendTo("div");

/*自定义内容*/
$("<span>你好</span>").appendTo("div")
</script>

</html>


小结：

append()和appendTo（）的比较：

1.方向的问题：

 append方法中追加的内容在后面

 appendTo方法中追加的内容内容在前面面

 2.内容问题：

都可以添加自己定义的内容，都具有标签解析功能；

  还可以添加内面存在的内容，但会发生内容的偏移。

二.

prepend（）：向每个匹配的元素内部前置内容。

prependTo（）：把所有匹配的元素前置到另一个、指定的元素元素集合中。

prepend方法和append方法类似,可以参考append方法学习：
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签：  jquery 方法 append prepend 总结
相关文章推荐
新的分享
章节导航