JavaScript'te nesne yönelimli DOM manipülasyonunda muckup karıştırmak

Question

Bu karışıklığı çözmek için oldukça uğraşıyorum (Javascript sık kullandığım dillerden biri değildir ve muhtemelen kodu karıştırıyorum, özür dilerim muyuzsa!)

'JoinRequestsList' kimliğindeki öğede yer alan bir HTML tablosunu yinelemeye çalışıyorum. W3Schools'un web sitesinde (özellikle here), bir eleman alabildiğim halde, bir çocuk elemanı almak için aynı yönteme (veya benzerine) başvurunuz. Neyse, işte benim kodudur:

var one = document.getElementById("JoinRequestsList"); 
var two = one.getElementsByClassName("table"); 
var table = two.getElementsByTagName("tbody"); 
for (var i = 0, row; row = table.rows[i]; i++) { 
    for (var j = 0, col; col = row.cells[j]; j++) { 
    if(row.getElementByTagName("a") != NULL) { 
     console.log(row.getElementByTagName("a").title); 
    } 
    } 
} 

hatalar (soru içinde web sayfasında Google Chrome Konsolu çalışırken) alıyorum hata iletisi:

VM818:4 Uncaught TypeError: two.getElementsByTagName is not a function(…)

ne yapabileceğini bu sorunu çözmek için? Teşekkür ederiz.

Answer 1

getElementsByClassName ve getElementsByTagName dönüş diziler, onunla her şeyi şey yapmasını istiyor eğer dizinin belli bir elemanı seçmek gerekir olsun. Ya da sadece onların üzerinden dönün.

Ayrıca dikkat, anchor öğelerinin büyük olasılıkla satırlarda değil, hücrelerde yer alması olasıdır (gerçekten kötü HTML olmadıkça).

var one = document.getElementById("JoinRequestsList"); 
var tables = one.getElementsByClassName("table"); 
var theTable = tables[0]; //assuming you have one table, or just want the first one 
var tableBodies = theTable.getElementsByTagName("tbody"); 
var tableBody = tableBodies[0]; 

for (var i = 0, row; row = tableBody.rows[i]; i++) { 
    for (var j = 0, cell; cell = row.cells[j]; j++) { 
     var anchors = cell.getElementsByTagName("a"); 
     for(var anchorIdx = 0; anchorIdx < anchors.length; anchorIdx++) 
     { 
     console.log(anchors[anchorIdx].title); 
     } 
    } 
    } 
}