通过classname访问Span Inside Div

时间:2014-01-06 05:33:21

标签: javascript html css

我需要使用document.getElementsByClassName()来访问div中的span。

我有 -

<div class="PERSON">
    <span class="name">Person_name</span>
    <span class="title">Person_title</span>
    <span class="team">Person_team</span>
</div>

我需要使用类PERSON访问所有div中所有类别团队的跨度。我该怎么做?

我有以下代码 -

function dispTeam(tname)
{
   alert(tname);
   var e=document.getElementsByClassName("PERSON");
   for(var m=0;m<e.length;m++)
   {
      if(e[m].document.getElementsByClassName("team").innerHTML.indexOf(tname)==-1)
      {
         e[m].style.display="none";
      }
      else
      {
         e[m].style.display="block";
      }
   }
}

警报已被触发,但元素未显示。

注意:有些PTS类的div与类团队没有跨度。我也需要在这种情况下包括那些div。

如果他们没有span class team,则不得显示这些div。

1 个答案:

答案 0 :(得分:1)

请改用此代码:

dispTeam=function(tname)
{
    var divs=document.getElementsByTagName("div");
    for(var i=0; i<divs.length; i++)
        divs[i].style.display='none';
    var span=document.querySelectorAll(".PERSON>.team");
    for(var i=0; i<span.length; i++)
    {
        if(span[i].innerHTML.indexOf(tname)!=-1)
            span[i].parentNode.style.display='block';
    }
}

<强> DEMO

了解详情: querySelector() and querySelectorAll()