在javascript中使用正则表达式增量数字

Using regex incremental numbers in javascript

本文关键字:数字 正则表达式 javascript      更新时间:2023-09-26

我试图通过id隐藏元素:

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

但是有很多div,比如Table1, Table2, Table3…

那么在这种情况下如何使用正则表达式呢?

设置class为所有这些元素。它就是为这种情况而发明的。

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";
}

UPDATE:如果设置类在您的情况下不适用,您可以始终使用现代方法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/

正则表达式在本例中不起作用。

要么在所有元素上使用一个通用的类名,要么,如果你不能改变HTML,你可以使用selector API来选择你需要隐藏的元素。

使用

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

选择所有ID以"Table"开头的元素,所以它可以是Table1, Table2,也可以是TableOfProducts,记住这一点。

然后你需要遍历这个并检查id属性是否匹配/^Table'd+$/正则表达式

举个例子,如果你把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';
        }