javascript - 如何通过将光标移到 DIV 上来在 DIV 中修改和成像

Question

我刚开始编写代码，但一直困在我正在编写的代码中。首先，我将鼠标传递到名为“Article”的 DIV 容器中，里面的所有内容都会改变其不透明度。我只想改变里面的图像的不透明度，所以在 DIV 内部的任何地方，图像的不透明度都应该是 1。一旦鼠标移开，图像的不透明度应该变成 0.75。我尝试了多种代码，但 DIV 内的每个元素的不透明度都发生了变化。希望你能帮助我。

我试图更改文档。 getElementsByTagName ('article') [i] by document.getElementsByTagName('img')[i] 但是当鼠标悬停在图像上时它只是改变了图像的不透明度。我试过 document.getElementsByTagName('article')[i].getElementsByTagName('img')[i] 和以前一样。我试图通过 img.style 更改 this.style 没有任何反应......

for (var i = 0; i<document.querySelectorAll('article').length;i++)
document.getElementsByTagName('article')[i].onmouseover=function(){
this.style.opacity = 1;
}
for (var i = 0; i<document.querySelectorAll('article').length;i++)
document.getElementsByTagName('article')[i].onmouseleave=function(){
this.style.opacity = 0.75;
}

希望当我跳过一篇文章时图像不透明度会改变。谢谢，祝你们今年过得愉快!

Answer 1

尝试使用 querySelectorAll('article img') 而不是 getElementsByTagName。这只会影响 img inside article。