在JavaScript中使用正則表達式增量數字

Question

我正在嘗試通過其ID隱藏元素：

document.getElementById('Table1').style.display = 'none';

但是有很多div像Table1，Table2，Table3 ...

那么如何在這種情況下使用正則表達式呢？

Answer 1

將類設置為所有這些元素。 它是為這種情況而發明的。

HTML：

<div id="Table1" class="myTables"></div>
<div id="Table2" class="myTables"></div>
<div id="Table3" class="myTables"></div>

JavaScript：

var elements = document.getElementsByClassName("myTables");
for (var i = 0, len = elements.length; i < len; i++) {
    elements[i].style.display = "none";
}

---

更新：如果設置類不適用於您的情況，則始終可以使用現代方法querySelectorAll ，其屬性以選擇器開頭 ：

var elements = document.querySelectorAll("div[id^='Table']");
for (var i = 0, len = elements.length; i < len; i++) {
    elements[i].style.display = "none";
}

演示： http : //jsfiddle.net/L2de8/

Answer 2

在此示例中，正則表達式不起作用。

在所有元素上使用通用的類名，或者，如果無法更改HTML，則可以使用Selectors API選擇需要隱藏的元素。

采用

var allElemsWithIdStartingFromTable =  document.querySelectorAll('[id^="Table"]');

選擇ID以“ Table”開頭的所有元素，因此請記住Table1，Table2和TableOfProducts。

然后，您需要對此進行迭代，並檢查id屬性是否與/^Table\\d+$/正則表達式匹配。

Answer 3

例如..如果您將myTables作為div的類名，請使用它作為長度。

var elements = document.getElementsByClassName("myTables");//to know the length only..
        for(var i=0;i<elements.length;i++)
        {
        document.getElementById('Table'+i).style.display = 'none';
        }

使用循環的概念。它是一個例子。