<html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>jQuery插入,复制、替换和删除节点</title> <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <script> $(function(){ 几种添加节点的方法 $("p").append("你好吗?");//向p元素中追加《b》 $("你好吗?").appendTo("p");//将《b》追加到p元素中 $("p").prepend("你好吗?");//向p中前置《b》 $("你好吗?").prependTo("p");//将《b》前置到p元素中 $("p").after("你好吗?");//向p元素后插入《b》 $("你好吗?").insertAfter("p");//将《b》插入到p元素后边 $("p").before("你好吗?");//在p元素之前添加《b》 $("你好吗?").insertBefore("p");//将《b》插入到p元素前面 // 几种删除节点的方法 var $li=$('ul').find('li:eq(1)').remove();//删除ul节点中第2个元素节点 $("ul").append($li);//把刚删除的元素节点从新添加到ul元素中去 $("ul li").remove("li[title!=菠萝]");//将ul元素下title属性不等于"菠萝"的li元素删除 $("ul li:eq(1)").empty();//清空ul节点下第2个li元素的内容 // 复制节点 $('ul').find('li').on('click',function(){ $(this).clone(true).appendTo("ul"); //复制当前点击的节点,并将它追加到《ul》元素中,当添加参数时复制它的事件 }); // 替换节点 $("p").replaceWith("你最不喜欢的水果是?"); }); </script> </head> <body> <p>你好!</p> <p>你最喜欢的水果是?</p> <ul> <li>苹果</li> <li>橘子</li> <li>菠萝</li> </ul> </body> </html>
jQuery:節點(插入,複制,替換,刪除)操作,需要的朋友可以參考一下。
閲完此文,您的感想如何?
-
有用
0
-
沒用
0
-
開心
0
-
憤怒
0
-
可憐
0
1.如文章侵犯了您的版權,請發郵件通知本站,該文章將在24小時内刪除;
2.本站標注原創的文章,轉發時煩請注明來源;
3.交流群: 2702237 13835667
相關課文
-
JS如何防止父節點的事件運行
-
nodejs編寫一個簡單的http請求客戶耑代碼demo
-
說一則爲什麽後耑開發人員不選擇node.js的原因
-
使用Sublime Text3 開發React-Native的配置
我要說說
網上賓友點評
課文推薦
排行熱門
- 使用electron-forge和cnpm命令來寫一個簡單的electron桌面應用
- UEditor百度編輯器中各種html標簽被過濾掉的解決辦法
- ueditor在使用嚴格模式時報錯Uncaught TypeError: 'caller', 'callee', and 'arguments'
- JS的Timeout定時器怎麽寫成無限循環的?
- jQuery的mouseover和mouseout事件當快速移動,事件延遲觸發問題
- jQuery select下拉框的選中事件
- javascript測試用斷點語句debbuger
- 第一章 Node.js基本介紹——1.2 堆棧追蹤
- select2 支持多值下拉框