在web前端开发实际运用中，经常会涉及到一些DOM的操作，今给大家分享一下Jquery中的append函数方法和preappend的用法和区别，1、append()表示向每个元素内部追加内容2、pre
在web前端开发实际运用中，经常会涉及到一些DOM的操作，今给大家分享一下Jquery中的append函数方法和preappend的用法和区别，
1、append()表示向每个元素内部追加内容
2、prepend()向每个匹配的元素内部前置添加内容
实例代码如下：
<!DOCTYPE HTML><html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <script type="text/javascript" src="jquery-1.7.js"></script> <style type="text/css"> p:hover{ color:red; cursor:pointer; background:blue; } </style> <script type="text/javascript"> <!-- //给每一个p标签内部的末尾添加一个span标签 function f1() { $("p").each(function(){ $(this).append("<span style='color:blue'> 大家好,我是append添加的span标签</span>") }) } //给每一个p标签内部的开头添加一个span标签 function f2() { $("p").each(function(){ $(this).prepend("<span style='color:green'>大家好,我是prepend添加的span标签 </span>") }) } //--> </script> </head> <body><p>床前明月光</p><p>疑是地上霜</p><p>举头望明月</p><p>低头思故乡</p> </ul><input type="button" value="append" onclick="f1()"><input type="button" value="prepend" onclick="f2()"> </body></html>
本站部分文章来自网络或用户投稿，如无特殊说明或标注，均为本站原创发布。涉及资源下载的，本站旨在共享仅供大家学习与参考，如您想商用请获取官网版权，如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。