Question

我正在动态创建一个列表，我需要能够从表格单元格中检索值。结构是：

<ul id="tester">
<li><div><table><tr><td></td><td id="samecellid">I WANT THIS TD VALUE..
<li><div><table><tr><td></td><td id="samecellid">I WANT THIS TD VALUE..
<li><div><table><tr><td></td><td id="samecellid">I WANT THIS TD VALUE..

每个列表项都有一个表 - 这个表只有一行，所以td id在每个列表项中都是唯一的，但显然不在整个列表中。

我遇到的问题是我似乎无法获得td单元格的值。我尝试了几种方法，这是我的最新方法，它不起作用：

if (lengthoflist > 0) {    
    for (i=1; i<=lengthoflist; i++){    

    var ul = document.getElementById("tester");
    var mya = ul.getElementsByTagName("li")[i];                     
    var myb = mya.getElementsByTagName("div");      
    var myc = myb.getElementsByTagName("table");
    var myd = myc.getElementsByTagName("tr");
    var mye = myd.getElementById("samecellid");

    var celldata = mye.innerHTML;
}
}

Answer 1

getElementsByTagName返回一个数组，所以最好是这样：

if (lengthoflist > 0) {  
    var ul = document.getElementById("tester");

    for (i=1; i<=lengthoflist; i++) {    

        var mya = ul.getElementsByTagName("li")[i];                     
        var myb = mya.getElementsByTagName("div")[0];      
        var myc = myb.getElementsByTagName("table")[0];
        var myd = myc.getElementsByTagName("tr")[0];
        var mye = myd.getElementsByTagName("td")[1]; // the second

        var celldata = mye.innerHTML;
    }
}

但是当然在td标签上有一个唯一的ID，你可以直接得到它。

Answer 2

如果您使用了唯一ID，则可以直接获取它们，而无需沿着HTML树下载：

var mye = myd.getElementById("samecellid");
var myeA = myd.getElementById("samecellidA");

Answer 3

做这样的事情。

<ul id="tester">
<li><div><table><tr><td></td><td id="samecellid1">I WANT THIS TD VALUE..
<li><div><table><tr><td></td><td id="samecellid2">I WANT THIS TD VALUE..
<li><div><table><tr><td></td><td id="samecellid3">I WANT THIS TD VALUE..

if (lengthoflist > 0) {    
    for (i=1; i<=lengthoflist; i++){
      var mye = document.getElementById("samecellid" + i);

      var celldata = mye.innerHTML;
  }
}

Answer 4

在循环中检索li标签，然后获取每个li中的最后一个td。我稍微修改了你发布的代码。你开始循环为1，这意味着你不会检索第一个列表项。数组为0索引，因此从0开始。在列表长度中，您使用了<=，其中包含列表末尾的不存在元素。

var liTags = document.getElementById("tester").getElementsByTagName('li'); 

for (var i = 0; i < liTags.length; i++) {
    var tdTags = liTags[i].getElementsByTagName('td');
    var celldata = tdTags[tdTags.length - 1].innerHTML; //last td
    console.log(celldata);
}

更新：

这是一种稍微有效的方法。

var liTags = document.getElementById("tester").getElementsByTagName('li'); 

for (var i = 0; i < liTags.length; i++) {
    var celldata = liTags[i].getElementsByTagName('tr')[0].lastChild.innerHTML;  //last td
    console.log(celldata);
}

使用Javascript访问列表项中的表格单元格数据

4 个答案: