gpt4 book ai didi

javascript - 如果另一个元素等于某个文本,则更改具有相同类的每个 div 元素的颜色

转载 作者:太空宇宙 更新时间:2023-11-04 02:45:53 25 4
gpt4 key购买 nike

如果 myDiv 中的文本等于字符串“Hello”,则每个具有 myDiv 类的 div 元素的背景色都会更改为蓝色。我想修改此 javascript 代码,如果在 myDiv 类中将是字符串“Hello”,则每个名称为 changedcolor 的类都会将其背景颜色更改为蓝色。

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

</style>
</head>
<body>

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


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

<script>

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

</body>
</html>

这是在 style.css 中:

 .blue { background-color: blue; }

最佳答案

我不确定,如果我理解正确的话,但是您可以尝试下面的代码,如果至少有一个元素包含“Hello”,它会将类“blue”添加到类为“changedcolor”的每个元素。 (我现在不更改“Hello”元素的颜色。

这是普通的 JavaScript 版本。正如 Karamell 所提到的,您可以(并且应该)使用 jQuery 来做到这一点。

var targets = document.getElementsByClassName('myDIV');
var foundHello = false;

for (var i = 0; i < targets.length; i++) {
// Plain Javascript
if (targets[i].innerHTML.indexOf("Hello") != -1) {
elementList = targets[i].querySelectorAll('.changedcolor');

for (var j = 0; j < elementList.length; j++) {
elementList[j].className = 'changedColor blue';
}
}
}
.blue {
background-color: blue;
}
<body>
<div class="myDIV">
Hello
<div class="changedcolor">Bye</div>
</div>
<div class="myDIV">
These are not the druids you are looking for.
<div class="changedcolor">See you later</div>
</div>
</body>

关于javascript - 如果另一个元素等于某个文本,则更改具有相同类的每个 div 元素的颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33858571/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com