开发者学堂课程【jQuery 开发教程：jQuery_DOM 插入现有元素内】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/362/detail/4294
jQuery_DOM 插入现有元素内
目录：
一、DOM 插入元素 append 方法
二、DOM 插入元素 appendTo 方法
三、DOM 插入元素 html 方法
四、DOM 插入元素 prepend 方法
五、DOM 插入元素 prependTo 方法
六、DOM 插入元素 text 方法
一、DOM插入现有元素内
1、.append（）
在每个匹配元素里面的末尾处插入参数内容。
示例：
使用append 方法，在 p 标签后追加 p 标签
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"><title></title> <script src="jquery-2.2.1.min.js"></script></ head> body> <p>hahaha</ p> <p>hahaha</p><script> $ (document) .ready ( function( ) { $ ("P").append ( "<p>hehe</p>")}) < / script> </ body> < / html>
运行结果：
2、appendTo()
将匹配的元素插入到目标元素的最后面(译者注:内部插入)。
示例：将span标签移动到p标签内
<! DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"><title></title> <script src="jquery-2.2.1.min.js"></script></head> <body> <span>我是span< /span><p>hahaha</p> <p>hahaha</p><script> $ (document).ready ( function() { $ ( "p" ).append ( "<p>hehe</ p> ") ; $ ( "p" ).append(s$( "span")); }) < / script> < / body> < / html>l
运行结果：
3、.html()
获取集合中第一个匹配元素的HTML内容设置每一个匹配元素的html内容。
示例：获取span标签内容
<body> <span>我是span</span><p>hahaha</p> <p>hahaha</p><script> $ ( document).ready ( function() { $ ( "p" ).append ( "<p>hehe<f/ p>"); $ ( "p"' ) . append ($ ( "span")); $ ( "<p>111</p>") .appendTo($( "p")); $ ( "span" ).htmlO;I }) < / script> < / body>
4、prepend()
将参数内容插入到每个匹配元素的前面(元素内部)。
5、.prependTo（）
将所有元素插入到目标前面(元素内)。
6、.text()
得到匹配元素集合中每个元素的合并文本，包括他们的后代设置匹配元素集合中每个元素的文本内容为指定的文本内容。
<! DOCTYPE html > <html lang ="en”> <head> <meta charset ="UTF-8"> <title></title> <scriptsrc="http://apps,bdimg. . com/libs/jquery/2.1.4/jquery.min.js"></script> <head> <body> <span>我是span</span> <p>hahaha</p> <p>hahaha</p> <script> $(document).ready(function(){ $(“p”).append (“<p>hehe</p>”) $(“p”).append($(“span”)); $(“<p>111</p>”).appendto($(“p”)); $(“span”).html() (console一下变为 console.log($(“span”).html()； ) $(“span”).html(hahaha) $(“p”).prepend(“<div>233333333</div>”); $(“<div>666</div>”). prependTO($(“p”)) }) </script> < /body </html>
