删除孩子DOM节点

    xiaoxiao2021-04-18  62

    1. var  n = document.getElementById( 'divName' ).childNodes.length;   

    2. for  (  var  i = 0; i < n; i++) {  

    3.     document.getElementById( 'divName' ).removeChild(   

    4.     document.getElementById( 'divName' ).childNodes[i]);   

    5. }  

    [js] view plaincopy

    1. var n = document.getElementById('divName').childNodes.length;  

    2. for ( var i = 0; i < n; i++) {  

    3.     document.getElementById('divName').removeChild(  

    4.     document.getElementById('divName').childNodes[i]);  

    5. }  

     

    很简单的思路,就是一个一个删除吧,可是运行时候就会发现问题,因为在使用removeChild的时候,DIV的child的数量已经减去1了,也就是说假如说有3个孩子,对应为childNodes[0],childNodes[1],childNodes[2]。当执行完第一次将childNodes[0]删除后,i变为1,但此时原来剩下的childNodes[1],childNodes[2]已经变成了childNodes[0],和childNodes[1]...以此类推,就会发现这种方式是不可取的,原因就在于DIV的孩子数会随删除而减少。所以改了一下做法,实现了这个简单的小功能。

    Js代码   

    1. var  n = document.getElementById( 'divName' ).childNodes.length;   

    2. for  (  var  i = 0; i < n; i++) {  

    3.     document.getElementById( 'divName' ).removeChild(document.getElementById( 'divName' ).firstChild);   

    5. } 

    转载请注明原文地址: https://ju.6miu.com/read-675394.html

    最新回复(0)