這次帶給大家jQuery複製節點使用詳解,jQuery複製節點使用的注意事項有哪些,下面就是實戰案例,一起來看一下。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.10.1.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $("ul li").click(function(){ $(this).clone().appendTo("ul"); // 复制当前点击的节点,并将它追加到<ul>元素 }) }); </script> </head> <body> <p title="选择你最喜欢的水果." >你最喜欢的水果是?</p> <ul> <li title='苹果'>苹果</li> <li title='橘子'>橘子</li> <li title='菠萝'>菠萝</li> </ul> </body> </html>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.10.1.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $("ul li").click(function(){ $(this).clone(true).appendTo("ul"); // 注意参数true //可以复制自己,并且他的副本也有同样功能。 }) }); </script> </head> <body> <p title="选择你最喜欢的水果." >你最喜欢的水果是?</p> <ul> <li title='苹果'>苹果</li> <li title='橘子'>橘子</li> <li title='菠萝'>菠萝</li> </ul> </body> </html>
效果圖如下:
我相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
#以上是jQuery複製節點使用詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!