亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

使用javascript將HTML表格數據轉換為數組形式

使用javascript將HTML表格數據轉換為數組形式

RISEBY 2023-08-05 20:50:38
我有一個問題,即使我將表數據存儲到數組中,數組也顯示未定義?以數組的形式獲取每個問題的行function getAllProblemRowElements() {? ? //var k = document.querySelector("#app > div > div > div > div.table-responsive > table > tbody");? ? const tableContents = document.querySelector("#app > div > div > div > div.table-responsive > table > tbody");? ? const sources = Array.from(tableContents,source=>tableContents[0]);? ? return sources;}?請解決
查看完整描述

3 回答

?
慕絲7291255

TA貢獻1859條經驗 獲得超6個贊

表內容轉數組


var myTableData = Array.prototype.map.call(document.querySelectorAll('#myTable tr'), function(row){

  return Array.prototype.map.call(row.querySelectorAll('td'), function(td){

    return td.innerHTML;

    });

  });


console.log(myTableData)

<table id="myTable">

<tr>

  <td>1</td>

  <td>a</td>

</tr>

<tr>

  <td>2</td>

  <td>b</td>

</tr>

<tr>

  <td>3</td>

  <td>c</td>

</tr>

</table>


查看完整回答
反對 回復 2023-08-05
?
茅侃侃

TA貢獻1842條經驗 獲得超21個贊

這是ES6版本


const myTableData = [...document.querySelectorAll('#myTable tr')]

  .map(row => [...row.querySelectorAll('td')]

    .map(cell => cell.textContent));


console.log(myTableData)

<table>

  <tbody id="myTable">

    <tr>

      <td>1</td>

      <td>a</td>

    </tr>

    <tr>

      <td>2</td>

      <td>b</td>

    </tr>

    <tr>

      <td>3</td>

      <td>c</td>

    </tr>

  </tbody>

</table>


查看完整回答
反對 回復 2023-08-05
?
瀟瀟雨雨

TA貢獻1833條經驗 獲得超4個贊

我假設您的問題中定義的問題行是標題。您可以使用querySelectorAllindocument獲取所有行,然后將其映射到數組中。希望下面的代碼有幫助:


function getAllProblemRowElements() {


    const tableContents = document.querySelectorAll("#app > div > div > div > div.table-responsive > table > tbody > tr");

    const sources = Array.from(tableContents,source=>source.children[2].getAttribute("value"))

    return sources;

}


查看完整回答
反對 回復 2023-08-05
  • 3 回答
  • 0 關注
  • 220 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號