Question

我有一张桌子和一个按钮。如果我单击按钮，则所有<tr>的ID都以“tr”开头（在示例中为前3个）应设置为display = "none";

有没有人知道我是如何让这个工作的？

Answer 1

给出id="tr_NNNN"个不同类的所有元素，例如： class="tr tr_NNNN"。然后使用以下循环：

var hide_trs = document.getElementsByClassName('tr_NNNN');
for (var i = 0; i < hide_trs.length; i++) {
    hide_trs[i].style.display = "none";
}

Answer 2

您可以使用ID简单地遍历您的tr元素：

    function doJS() {
      for(var i = 1; i <= 3; i ++) {
        document.getElementById("tr_" + i).style.display="none";
      }
    }

Answer 3

您无法为gEBI提供通配符，但您可以在qSA中使用属性starts with selector：

document.querySelectorAll("[id^='tr_']")[0].style.display="none";

Answer 4

我同意为此使用类而不是ID，但这应该满足您原来的问题：

function doJS() {

var rows = document.getElementsByTagName("tr");
for (var i = 0; i < rows.length; i++) { 
    var row = rows[i];
    if(row.getAttribute("id") && /^tr/.test(row.getAttribute("id"))){
       row.style.display = 'none';   
    }
  }
}

http://jsfiddle.net/eHSwJ/14/

虽然这不是一个jQuery问题，但我会指出，通过利用jQuery，这可以简化为：

 $('tr[id^="tr"]').css('display', 'none');

JS：getElementByID通配符

4 个答案: