Question

我想隐藏一个表，如果它的“td”为空。我正在尝试使用此功能，但它不起作用：

function isEmptyTable(){
    var tdTable = document.getElementsByName('tdTable').textContent;
    var table = document.getElementsByName('tableToday');
    if(tdTable == "")
        table.style.display = 'none';
}

任何提示？

HTML：

<body onload="isEmptyTable()">
                <table name="tableToday"> 
                    <thead>

                        <tr>
                            <th>Prêmio</th>
                            <th>Resultado</th>
                            <th>Grupo</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <th>1º</th>
                            <td name="tdTable">oi</td>
                            <td name="tdTable"></td>
                        </tr>
                    </tbody>
                </table>

Answer 1

我使用getElementById和getElementsByClassName选择器来实现这一目标：

＆＃13;

function isEmptyTable(myId){
    let tds = document.getElementsByClassName(myId);
    let hide = false
    for (let element of tds) {
      if (element.innerHTML.length == 0) hide = true
    }
    let myTable = document.getElementById(myId);
    if (hide) myTable.style.display = 'none';
}
isEmptyTable("myTable")
isEmptyTable("myTable2")

＆＃13;

td {
  border: 1px solid red;
}

＆＃13;

<table id="myTable">
  <tr>
    <td class="myTable"></td>
    <td class="myTable">
     lololo
    </td>
  </tr>
</table>

<table id="myTable2">
  <tr>
    <td class="myTable2">asdasd</td>
    <td class="myTable2">
     lololo
    </td>
  </tr>
</table>

＆＃13;

Answer 2

代码中的

只需更改这两行。因为td将在集合中返回，所以使用数组索引[0]

function isEmptyTable(){
var tdTable = document.getElementsByName('tdTable')[0].textContent;
var table = document.getElementsByName('tableToday')[0];
if(tdTable == "")
    table.style.display = 'none';

}

它会正常工作。

Answer 3

问题在于：

var tdTable = document.getElementsByName('tdTable').textContent;

和

table.style.display = 'none';

因为函数document.getElementsByName()没有返回一个简单的变量，所以它返回一个数组，所以为了解决这个问题，你必须改变这个部分：

var tdTable = document.getElementsByName('tdTable').textContent;

到

var tdTable = document.getElementsByName('tdTable')[0].textContent;

并将table.style.display = 'none';更改为table[0].style.display = 'none';

有关document.getElementsByName() Click here

的详细信息

如果表为空则隐藏表（仅使用JS）

3 个答案: