Question

我需要隐藏其ID中任何地方都包含字符串“replies-36965584”的所有元素。

HTML：

<div id="replies-36965584_1">aaaa</div>
<div id="replies-36965584_2">aaaa</div>
<div id="replies-36965584_3">aaaa</div>
<div id="replies-36965584_4">aaaa</div>
<div id="replies-36222224_2">nnnn</div>

JavaScript的：

document.getElementById("replies-36965584").style.display="none"

如何修改此JS以选择前四个元素？

Answer 1

您可以使用CSS和属性选择器执行此操作。

[ATT ^ = VAL]

表示具有att属性的元素，其值以前缀“val”开头。如果“val”是空字符串，则选择器不代表任何内容。

来源：http://www.w3.org/TR/css3-selectors/#attribute-substrings

jsfiddle

CSS

[id^="replies-36965584_"] {
    display: none;
}

Answer 2

使用jQuery是一个选项吗？如果是这样，这很简单：

$(document).ready(function(){
    $('div[id^="replies-36965584"]').hide();
});

如果您不熟悉jQuery，请参阅以下链接：http://learn.jquery.com/javascript-101/getting-started/

编辑：修复了语法错误。

编辑：添加了jsFiddle：http://jsfiddle.net/xbVp9/

Answer 3

如果你不知道某些文字值，但是你知道一般模式，只有数字会改变，那么我会考虑与常规表达式匹配。

Answer 4

你可以用痛苦的方式做到：

var o = document.getElementsByTagName("div");
for (var i=0;i<o.length;i++) { 
    if(o[i].id.indexOf('replies-36965584') == 0) {
        o[i].style.display = 'none';
    }
}

Answer 5

使用我知道的vanilla javascript执行此操作的唯一方法是获取页面上的所有div，并测试所需的id。

var divs = document.getElementsByTagName('div');
for (var i = 0; i < divs.length; ++i) {
    var div = divs[i];
    if (/replies-36965584/.test(div.id)) {
        div.style.display = 'none';
    }
}

带有更改ID的getElementById

5 个答案:

[ATT ^ = VAL]

CSS