javascript – 使用正则表达式搜索div类

发布时间：2020-12-14 23:18:17 所属栏目：资源来源：网络整理

导读：听起来很简单,呵呵.我发现很多答案,但都使用jQuery或ProtoType.我想要简单的JavaScript.它不应该那么难,但JavaScript不是我的事;没有中央文件意味着寻找年龄而不是找到我想要的东西. 请考虑以下HTML代码段：现在我想使用JavaScript来处理那些DIV. function

听起来很简单,呵呵.我发现很多答案,但都使用jQuery或ProtoType.我想要简单的JavaScript.它不应该那么难,但JavaScript不是我的事;没有中央文件意味着寻找年龄而不是找到我想要的东西.

请考虑以下HTML代码段：


现在我想使用JavaScript来处理那些DIV.

function processDivElements()
{
 // search for relevant DIV classes
 var divArray = document.getElementsByClass.regex('/^central_.*$/');

 // do stuff with the DIV elements found
 foreach (divArray as divElement)
 {
   divElement.style.background = '#f00';
 };
}

任何人都可以帮我翻译成适当的纯JavaScript吗？我使用的是类,而不是ID.我更喜欢使用正则表达式.


最佳答案
jQuery解决方案真的很棒：

var $divs = $('div[class^="central_"]');

如果您只想支持更新的浏览器,可以使用document.querySelectorAll()基本上做同样的事情：

var divs = document.querySelectorAll('div[class^="central_"]');

如果你想支持旧的浏览器,代码会变得很糟糕：

var all_divs = document.getElementsByTagName('div');
var divs = [];

for (var i = 0; i < all_divs.length; i++) {
    var div = all_divs[i];

    if (div.className.match(/^central_d+$/) {
        divs.push(div);
    }
}

也：


I use classes,not IDs. I prefer using a regular expression.

您的类是唯一的,并且实际上像ID一样运行,这实际上不是类的预期用途.改为构建你的HTML：


现在,JavaScript变得更简单：

var $divs = $('.central');                               // jQuery
var divs =  document.querySelectorAll('.central');       // Newer browsers
var divs =  document.getElementsByClassName('central');  // Older browsers


                        （编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!