如何隐藏元素与HTML文档中的DOM路径（和类）

-2

我有这样的HTML：（前display:none;）如何隐藏元素与HTML文档中的DOM路径（和类）

<div class="list first"> 
    <span class="total">2</span> 
    <div class="object"></div> 
</div> 

<div class="list"> 
    <span class="total">7</span> 
    <div class="object"></div> 
</div>

而且我想隐藏div.list.first如果span.total是高于2我怎样才能在JavaScript中做到这一点？第二个div与类list必须可见。

来源

2013-04-21 Modest

我不不明白如何在DOM中按类来获取元素。我知道如何通过ID获取元素。 – Modest 2013-04-21 22:51:11

这里是你如何得到一个类的元素（没有jQuery）：http://stackoverflow.com/questions/3808808/how-to-get-element-by-class-in-javascript – ahdaniels 2013-04-21 22:55:11

@Modest这里是一个[例子]（http://jsfiddle.net/bGQvj/）使用** ID **而不是** class **。 – Vucko 2013-04-21 23:02:31

这里与jQuery一个例子：

var text = []; // array to put all the span values in 
$('.total').each(function(){ //putting the values of span one by one into the array 
    text.push($(this).text()); 
}); 

$.each(text,function(){ //looping through the array and if the array value is larger then 2 ,it trigger the if statment 
    if(this>2){ 
     $('.first').hide(); 
    } 
});

jsFiddle演示使用上面的代码。

来源

2013-04-21 23:23:46 Vucko

一个快速和肮脏的CSSDeck Demo让你开始。 My references。

var divs = document.getElementsByTagName("div"); 
for(var i=0; i < divs.length; i++) 
{ 
    if((" "+divs[i].className+" ").replace(/[\n\t\r]/g, " ").indexOf(" list ") > -1) 
    { 
     if((" "+divs[i].className+" ").replace(/[\n\t\r]/g, " ").indexOf(" first ") > -1) 
     { 
      var spans = divs[i].getElementsByTagName("span"); 
      for(var j = 0; j < spans.length; j++) 
      { 
       if((" " + spans[j].className +" ").replace(/[\n\t\r]/g, " ").indexOf(" total ") > -1) 
       { 
        if(spans[j].innerHTML > 2) 
        { 
         spans[j].style.display = "none"; 
        } 
       } 
      } 
     } 
    } 
}

没想到你想要一个jQuery的答案，但这里有一个更简洁的片段：

$('div.list.first .total').each(function() 
{ 
    if($(this).text() > 2) 
     $(this).parent().hide(); 
});

来源

2013-04-21 23:22:20 SimonDever

使用jQuery的filter方法：

if($(".total").filter(function(){return $(this).text() >2; }).length > 0) 
{ 
    $(".first").hide(); 
}

参见：http://jsfiddle.net/T9Dkx/2/

来源

2013-04-22 00:56:39

一个简单的document.querySelectorAll()将获得基于类名的元素：

var totals = document.querySelectorAll('span.total'); 
for (var i = 0, l = totals.length; i < l; i++) { 
    if (parseInt(totals[i].childNodes[0].nodeValue, 10) < 2) { 
     continue; 
    } 

    document.querySelector('.list.first').style.display = 'none'; 
}

演示：http://jsfiddle.net/cVyBb

来源

2013-04-27 12:33:57 PeeHaa

如何隐藏元素与HTML文档中的DOM路径（和类）

回答

相关问题