Java Script
前情提要? 上一篇實作方法利用了三個迴圈,取得標題,將標題的資料利用索引(index) 抓取表格的內容,
程式碼如下:
let headData = Array.from(document.querySelectorAll('thead > tr > th')).map(n=>n.innerText)
console.log('headData', headData )
let tableObject = []
for(let trNode of document.querySelectorAll('tbody > tr') ){
let data = {};
Array.from(trNode.querySelectorAll('td')).forEach((n , index)=>{
data[ headData[index] ] = n.innerText
})
tableObject.push(data)
}
console.log( 'tableObject ',tableObject )
其中內容可以看到,第二段的地方,所跑的迴圈是針對 td 來做處理,headData 的部分其實也是針對 tr 下的 欄位去做處理,以前針對 XHTML 有稍微看一下規範,在標準的 HTML 結構下 TABLE 的子節點必須是 caption,colgroup,thead,tbody,tr 幾種節點,tr 這個節點下也只能有 th 跟 td 在這個標準規範下,我們理論上可以信任瀏覽器會解析這些元素來使用