Question

所以我有一个这样的脚本，可以通过javascript制作2x2表格

function createtable(){
          var tbl = document.getElementById('x');
            if (tbl.contains()==false){
              tbl.setAttribute('border', '1');
              var tbdy = document.createElement('tbody');
              for (var i = 0; i < 2; i++) {
                var tr = document.createElement('tr');
                for (var j = 0; j < 2; j++) {         
                    var td = document.createElement('td');
                    tr.appendChild(td);
                    td.style.height='50px';
                    td.style.width='50px';
                }
                tbdy.appendChild(tr);
              }
              tbl.appendChild(tbdy);
        }

<form>
    <input type="button" value="Create Table" onclick="createtable()"> <br>
</form>
<table id="x"> </table>

我想检查表x是否包含任何内容以创建自身。我试图使用contains（）进行检查，但是它不起作用。

Answer 1

您可以检查行数

var tbl = document.getElementById('x');
if(tbl.rows.length==0){
}

如果tbl.rows.length为0，则表示该表没有任何行

Answer 2

您可以检查表中的行数：

var x = document.getElementById("myTable").rows.length;

请参见参考：https://www.w3schools.com/jsref/coll_table_rows.asp

使用此方法：

var tbl = document.getElementById('x');
if (tbl.rows.length == 0) {
   // empty
}

Answer 3

如果要检查内部表是否存在，请执行此操作

document.getElementById("myTable").rows.length

更多信息here

Answer 4

有多种方法。一种方法，可以使用childElementCount属性。

if (tbl.childElementCount==0)
{

}

有关更多详细信息，请参阅link

Answer 5

在这种情况下，由于表中没有子元素或文本节点，因此您只需检查innerHTML属性是否为假即可。这样可以防止createtable函数在函数运行一次后附加其他子项。例如：

function createtable() {
  var tbl = document.getElementById('x');
  if (!tbl.innerHTML) {
    tbl.setAttribute('border', '1');
    var tbdy = document.createElement('tbody');
    for (var i = 0; i < 2; i++) {
      var tr = document.createElement('tr');
      for (var j = 0; j < 2; j++) {
        var td = document.createElement('td');
        tr.appendChild(td);
        td.style.height = '50px';
        td.style.width = '50px';
      }
      tbdy.appendChild(tr);
    }
    tbl.appendChild(tbdy);
  }
}

<form>
  <input type="button" value="Create Table" onclick="createtable()">
  <br>
</form>
<table id="x"></table>

Answer 6

普通的javascript：

!![].length

或使用Lodash

_.head([]);
// => undefined

如何使用javascript检查表是否为空

6 个答案: