带有getElementsByTagName的嵌套标记名称不起作用

时间:2012-11-12 08:39:57

标签: javascript jquery html css sorting

我有以下div,其中包含从数据库中查询的表及其数据

<div id="content">
<table>
<tbody>
   <tr>
       <th class="header" colspan="2">Food items include:</th>
   </tr>
   <tr>
      <td id="15" class="fruits">Papaya+salt</td>
      <td><p>This includes papaya and salt</p></td>
   </tr>
   <tr>
      <td class="meat">Baked chicken</td>
      <td><p>This includes a chicken thide and kethup</p></td>
   </tr>
   <tr>
      <td id="1" class="Juices">Strawberry Sting</td>
      <td><p>Sugar, color and water</p></td>
   </tr>
<table>
</div>

该表在page.aspx中定义

这是我用来按字母顺序对表数据进行排序的代码

OldFunc = window.onload;
window.onload = OnLoad;

function OnLoad(){
    try{
        var pathName = window.location.pathname.toLowerCase();
        if( pathName=="/Resources/Glossary.aspx") {
                sort_it();
            }   
        OldFunc();
    }
    catch(e) {
    }
} 

function TermDefinition(def_term,def_desc)
{    
    this.def_term=def_term;  
    this.def_desc=def_desc; 
}    

function sort_it()
{
    var gloss_list=document.getElementsByTagName('td');    
    var desc_list=document.getElementsByTagName('td p');    
    var gloss_defs=[];   
    var list_length=gloss_list.length;     
    for(var i=0;i<list_length;i++)    
    {      
       gloss_defs[i]=new TermDefinition(gloss_list[i].firstChild.nodeValue,desc_list[i].firstChild.nodeValue);      
    }     
    gloss_defs.sort(function(a, b){
      var termA=a.def_term.toLocaleUpperCase(); 
      var termB=b.def_term.toLocaleUpperCase();
      if (termA < termB) 
       return -1;
      if (termA > termB)
       return 1;
      return 0; 
    })    
    for(var i=0;i<gloss_defs.length;i++)
    {
       gloss_list[i].firstChild.nodeValue=gloss_defs[i].def_term;
       desc_list[i].firstChild.nodeValue=gloss_defs[i].def_desc;  
    }
}

请查看两个getElementsByTagName,我认为我滥用了它的内容,因为输出没有任何操作。

1 个答案:

答案 0 :(得分:4)

<强>无效

desc_list=document.getElementsByTagName('td p');

您无法将css选择器传递给该函数,只能传递div \ span input等标记名称。

您可能想要使用:

desc_list = $('td p');

由于您使用jQuery标记了问题,或者document.querySelectorAll标记了vanilla js:

desc_list = document.querySelectorAll('td p');