當前位置：
首頁 >
创建原生JS insertafter()方法实现
發布時間：2025/4/16
49
豆豆
生活随笔
收集整理的這篇文章主要介紹了
创建原生JS insertafter()方法实现
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title></title>
6 <body>
7 <div id="box">
8 <span>開始</span>
9 <p id="aaa">qqq</p>
10 <span>結束</span>
11 </div>
12 </body>
13 </html>
1 <script> 2 window.onload = function(){ 3 var box = document.getElementById("box"); 4 var aaa = document.getElementById("aaa"); 5 var p = document.createElement("p"); 6 afterinsert(p,aaa); 7 } 8 9 function afterinsert(newElement,targetElement){ 10 var parent = targetElement.parentNode; //得到父節點 11 if (parent.lastChild === targetElement) { 12 parent.appendChild(newElement); 如果最后一個子節點是當前元素，那么直接添加即可 13 }else{ 14 parent.insertBefore(newElement,targetElement.nextSibling); //否則，當前節點的下一個節點之前添加 15 } 16 17 } 18 19 </script>
1 <script> 2 window.onload = function(){ 3 var box = document.getElementById("box"); 4 var aaa = document.getElementById("aaa"); 5 var p = document.createElement("p"); 6 afterinsert(p,aaa); 7 } 8 9 function afterinsert(newElement,targetElement){ 10 var parent = targetElement.parentNode; //得到父節點 11 if (parent.lastChild === targetElement) { 12 parent.appendChild(newElement); 如果最后一個子節點是當前元素，那么直接添加即可 13 }else{ 14 parent.insertBefore(newElement,targetElement.nextSibling); //否則，當前節點的下一個節點之前添加 15 } 16 17 } 18 19 </script>
insertBefore()方法可以給當前元素的前面創建一個節點，但沒有提供給當前元素的后面創建一個節點，所以我們可以用已有知識創建一個insertafter方法
?
轉載于:https://www.cnblogs.com/zz334396884/p/7279627.html
總結
以上是生活随笔為你收集整理的创建原生JS insertafter()方法实现的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Web 端的下一代三维图形
- 下一篇： “5W1H”带你来学习JavaScrip