Javascriptを使用してリストアイテム内のテーブルセルデータにアクセスする

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.. 

各リスト項目がその中にテーブルを有している - このテーブルは1行のみがあるので、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

ループ内の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); 
} 

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

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を持つ、もちろん。