JS 操纵DOM问题，删除一个指定属性的元素


<div level="1">111</div>
<div level="1">2222</div>
<div level="2">33333</div>
<div level="2">44444444</div>
<div level="3">5555555555</div>
<div level="2"><a>66666666666</a></div>
<div level="2"><a>777777777</a></div>
<div level="1">9000</div>
<script>  
var aa =  document.getElementsByTagName("div");
for(var i=0;i<aa.length;i++)
{
var level = aa[i].level; 
if(level=="2")
{
aa[i].outerHTML="";
}
}
</script>  

解决方案 »

  1.   

    <div level="1">111</div>
    <div level="1">2222</div>
    <div level="2">33333</div>
    <div level="2">44444444</div>
    <div level="3">5555555555</div>
    <div level="2"><a>66666666666</a></div>
    <div level="2"><a>777777777</a></div>
    <div level="1">9000</div>
    <script> 
    function deldiv(){
    var div =  document.getElementsByTagName("div");
    for(var i=0;i<div.length;i++)
    {
    var level = div[i].level; 
    if(level=="2")
    {
    div[i].parentNode.removeChild(div[i]); 
    }
    }
    }
    </script> 
    <a href="javascript:" onclick="deldiv()">删除level为2的div元素以及其中包含的元素</a>
      

  2.   

    div没有level这个属性 能取出来么
      

  3.   

    兼容IE和FF的：<div level="1">111</div>
    <div level="1">2222</div>
    <div level="2">33333</div>
    <div level="2">44444444</div>
    <div level="3">5555555555</div>
    <div level="2"><a>66666666666</a></div>
    <div level="2"><a>777777777</a></div>
    <div level="1">9000</div>
    <script> 
    function deldiv(){
    var div =  document.getElementsByTagName("div");
    for(var i=0;i<div.length;i++)
    {
    var level = div[i].getAttribute('level'); 
    if(level=="2")
    {
    div[i].parentNode.removeChild(div[i]); 
    }
    }
    }
    </script> 
    <a href="javascript:" onclick="deldiv()">删除level为2的div元素以及其中包含的元素</a>
      

  4.   

    1楼的有点错误
    改正<div level="1">111</div>
    <div level="1">2222</div>
    <div level="2">33333</div>
    <div level="2">44444444</div>
    <div level="3">5555555555</div>
    <div level="2"><a>66666666666</a></div>
    <div level="2"><a>777777777</a></div>
    <div level="1">9000</div>
    <script>  
    var aa =  document.getElementsByTagName("div");
    var bb = new Array();
    for(var i=0;i<aa.length;i++)
    { 
    var tt = aa[i].level; 
    if(tt=="2")
    { 
    aa[i].outerHTML=""; 
    aa =  document.getElementsByTagName("div");
    i=i-1;
    }
    } 
    </script>  
      

  5.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Untitled Page</title>
    </head>
    <body>
        <div>
            <div level="1">
                a
            </div>
            <div level="1">
                b
            </div>
            <div level="2">
                c2
            </div>
            <div level="2">
                d2
            </div>
            <div level="3">
                e
            </div>
            <div level="2">
                f2
            </div>
            <div level="2">
                g2
            </div>
            <div level="1">
                h
            </div>
        </div>
        <input type="button" value="del Div Level=2" onclick="delLevelDiv('2')" />
    </body>
    </html><script type="text/javascript">
    function delLevelDiv(level)
    {
        var divs=document.getElementsByTagName('div');
        if(divs.length==0) return;
        var j=0;
        for(var i=0;i<divs.length;i++)
        {
            if(divs[i].getAttribute('level')==level) j++;
        }
        if(j==0) return;
        
        for(var i=0;i<divs.length;i++)
        {
            var p=divs[i].parentNode;
            if(divs[i].getAttribute('level')==level) 
             p.removeChild(divs[i]);
        }
        divs=document.getElementsByTagName('div');
        if(divs.length>0) delLevelDiv(level);
        
    }
    </script>
      

  6.   

    4 楼的也会有错的.还有漏掉的.
    改成下面的就很完美了<div level="1">111</div>
    <div level="1">2222</div>
    <div level="2">33333</div>
    <div level="2">44444444</div>
    <div level="3">5555555555</div>
    <div level="2"><a>66666666666</a></div>
    <div level="2"><a>777777777</a></div>
    <div level="1">9000</div>
    <script> 
    function deldiv(){
        var div =  document.getElementsByTagName("div");
        for(var i=0;i<div.length;i++)
        {
            var level = div[i].getAttribute('level'); 
            if(level=="2")
            {
                div[i].parentNode.removeChild(div[i]); 
                div =  document.getElementsByTagName("div");
                i=i-1;
            }
        }
    }
    deldiv();
    </script> 
      

  7.   

    <div level="1">111</div>
    <div level="1">2222</div>
    <div level="2">33333</div>
    <div level="2">44444444</div>
    <div level="3">5555555555</div>
    <div level="2"><a>66666666666</a></div>
    <div level="2"><a>777777777</a></div>
    <div level="1">9000</div>
    <script> 
    function deldiv(){
    var div =document.getElementsByTagName("div");
    var j=0;
    var arr=new Array(div.length)
    for(var i=0;i<div.length;i++)
    { 
    var level=div[i].getAttribute('level')
    if(level=="2")
    {
    arr[j]=div[i];
    j=j+1;
    }
    }
    for(var k=0;k<=j;k++){
    arr[k].parentNode.removeChild(arr[k]);
    }
    }
    </script> 
    这样就可以一次删完
    我再看看，为什么那样不能一次删完