Question

我尝试使用与某些特定文本相同的id更改每个div元素的背景颜色。下面的代码仅适用于我的代码中的第一个div。如何为每个具有相同ID和特定文本的div应用此功能。

确定。我知道Id需要是唯一的。你可以帮我一起上课吗？

<!DOCTYPE html>
<html>
<head>
<style> 

</style>
</head>
<body>

<div id="myDIV">
 Hello
</div>


<div id="myDIV">
 Hello
</div>

<script>

if (document.getElementById('myDIV').innerHTML.indexOf("Hello") != -1) {
document.getElementById('myDIV').style.backgroundColor='blue';
} 
</script>

</body>
</html>

Answer 1

是的，id必须是唯一的。

var targets = document.getElementsByClassName('myDIV');
for( var i in targets ) {
    if (targets[i].innerHTML.indexOf("Hello") != -1) {
        targets[i].className='myDIV blue';
    }  
};

然后在样式中添加颜色：

.blue { background-color: blue; }

这是一个小提琴： https://jsfiddle.net/mckinleymedia/5nj7yw2e/1/

Answer 2

您不能在同一网页中多次使用相同的ID。而是使用类。

使用类。

<div class="myDIV">
     Hello
</div>


<div class="myDIV">
     Hello
</div>

以下是demo

Answer 3

尝试使用课程：

<div id="myDIV1" class="myDIV">
 Hello
</div>
<div id="myDIV2" class="myDIV">
 Hello
</div>

JS：

var x = document.getElementsByClassName( "myDIV" );
for( var i = 0; i < x.length; i++ ) {
    x[i].style.backgroundColor='blue';
}

关于jsfiddle：

https://jsfiddle.net/ppd891xb/

Answer 4

id必须是唯一的。您可以使用class而不是id。根据{{3}}：

id属性指定其元素的唯一标识符（ID）。该值必须在元素的主子树中的所有ID中唯一，并且必须至少包含一个字符。该值不得包含任何空格字符。

Answer 5

我想和你分享这个。上面的代码对我不起作用，因为我想更改类名而不是更改属性。

我有一个日历，每天有一个ID，每种标记都有一个类名。这是，p。恩。假日那天，它的班级名称是假期＆＃39;。如果我在两周内没有去上班，那么这14天的课程名称就像“ausenciasDias＆＃39;”。我的意图是他们必须关闭，当鼠标悬停在按钮上时，他们必须显示或打开。

如果我跑：

("#button").on('click', function () {
    var x = document.getElementsByClassName( "ausenciasDias_off" );
    for( var i = 0; i < x.length; i++ ) {
        x[i].className = "ausenciasDias_on";
    }
});

然后只有少数<td class="ausenciasDias_off">开启。跟踪代码我发现＆＃34; i＆＃34;的索引是错误的，因为当一个类名更改索引指向下一个td时。为了解决这个问题，我使用下面的代码：

var targets = document.getElementsByClassName("diasAusencia_off");
var tamaño = targets.length;       
for (var i=0; i<tamaño; i++) {        
    var element = targets[0];
    element.className = "diasAusencia_on";
};

我希望它有助于某人。问候。

使用相同的id更改每个div元素的颜色，该id等于某些文本

5 个答案: