时间戳

首页 > 解决方案 > Javascript 读取表和 if value != null 获取行数据

javascript - Javascript 读取表和 if value != null 获取行数据

问题描述

如果行中 [X] 单元格的值为 != null，我如何使用 Javascript 读取表并从表中查找每一行，保存该行数据。

目前我刚刚发现如何使用这个脚本读取整个表格

<div class="container-fluid">
    <div class="card shadow mb-4">
        <div class="card-header py-3">



    <table class="table table-bordered" width="100%" cellspacing="0" id="tableID">
        <thead>
            <tr>
                <th>A</th>
                <th>B</th>
                <th>C</th>
                <th>D</th>
                <th>E</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>val1</td>
                <td>val2</td>
                <td>val3</td>
                <td>500</td>
                <td id="myID"><input type="hidden" name="txtID" id="txtID" value="100"></td>
            </tr>
            <tr>
                <td>val1</td>
                <td>val2</td>
                <td>val3</td>
                <td>1500</td>
                <td id="myID"><input type="hidden" name="txtID" id="txtID" value="200"></td>
            </tr>
            <tr>
                <td>val1</td>
                <td>val2</td>
                <td>val3</td>
                <td>1500</td>
                <td id="myID"><input type="hidden" name="txtID" id="txtID" value=""></td>
            </tr>
        </tbody>
    </table>


<script>
var myTab = document.getElementById('tableID');
        var tableData = [];
    // LOOP THROUGH EACH ROW OF THE TABLE AFTER HEADER.
    for (i = 1; i < myTab.rows.length; i++) {
        if(){

        }else{

        }
    }
</script>

我可以获得帮助以完成脚本的语法，或者我可以就如何解决这个问题获得一些指导

在此表示例中，应抓取的输出或行将是前 2 个 tr，因为它们是 != null

标签： javascriptjqueryhtml-table

解决方案

用于cells获取行的单元格，然后获取输入中的值cells[4]。如果不是空字符串，则将其保存到数组中。

var myTab = document.getElementById('tableID');
var tableData = [];
// LOOP THROUGH EACH ROW OF THE TABLE AFTER HEADER.
for (var i = 1; i < myTab.rows.length; i++) {
  var val = myTab.rows[i].cells[4].firstElementChild.value;
  if (val != '') {
    tableData.push(val);
  }
}
console.log(tableData);
<table class="table table-bordered" width="100%" cellspacing="0" id="tableID">
  <thead>
    <tr>
      <th>A</th>
      <th>B</th>
      <th>C</th>
      <th>D</th>
      <th>E</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>val1</td>
      <td>val2</td>
      <td>val3</td>
      <td>500</td>
      <td id="myID"><input type="hidden" name="txtID" id="txtID" value="100"></td>
    </tr>
    <tr>
      <td>val1</td>
      <td>val2</td>
      <td>val3</td>
      <td>1500</td>
      <td id="myID"><input type="hidden" name="txtID" id="txtID" value="200"></td>
    </tr>
    <tr>
      <td>val1</td>
      <td>val2</td>
      <td>val3</td>
      <td>1500</td>
      <td id="myID"><input type="hidden" name="txtID" id="txtID" value=""></td>
    </tr>
  </tbody>
</table>

推荐阅读