jquary中的創建節點和添加節點的方法
阿新 • • 發佈:2018-02-02
子元素 span 關於 .com href 百度一 clas script pre
今天來說一下針對jquary關於創建節點和添加節點的方法,先來看看創建節點:
1、直接添加節點內容即可
$("div").append(‘<a href="http://www.baidu.com">百度一下</a>‘);
2、可以創建jquary對象添加進去
var $li=$(‘<a href="http://www.baidu.com">百度一下</a>‘); $("div").append($li)
以上兩種方法都是常用到的。
接下來就看看如何添加節點:就拿這個簡單的小例子說明一下
1、append方法
<body> <div>我是裏面的div</div> <p>我是外面p</p> </body> <script> $(function(){ $("div").append($("p"));//添加到元素內容的後面 }) </script>
2、prepend方法
<body> <div>我是裏面的div</div> <p>我是外面p</p> </body> <script> $(function(){ $("div").prepend($("p"));//添加到元素內容的前面 }) </script>
3、appendTo方法
<body> <div>我是裏面的div</div> <p>我是外面p</p> </body> <script> $(function(){ $("p").appendTo($("div"));//子元素添加到父元素裏,並且添加到父元素內容的後面面 }) </script>
4、prependTo方法
<body> <div>我是裏面的div</div> <p>我是外面p</p> </body> <script> $(function(){ $("p").prependTo($("div"));//子元素添加到父元素裏,並且添加到父元素內容的前面 }) </script>
5、after方法
<body> <div>我是裏面的div</div> <p>我是外面p</p> </body> <script> $(function(){ $("div").after($("p"));//添加到自己的後面 }) </script>
6、before方法
<body> <div>我是裏面的div</div> <p>我是外面p</p> </body> <script> $(function(){ $("div").before($("p"));//添加到自己的前面 }) </script>
好了~以上便是添加節點的幾個方法,都可以用,不過具體項目中可以根據情況來具體使用!
jquary中的創建節點和添加節點的方法