Javascript 如何通过将光标移到DIV上来修改和映射DIV内的图像

我刚开始编写代码，我被困在我正在编写的代码中。 首先，我将鼠标放入名为“Article”的DIV容器中，其中的所有内容都会改变其不透明度。我只想改变里面的图像的不透明度，所以在DIV里面的任何地方，图像的不透明度都应该是1。鼠标离开后，图像的不透明度应变为0.75。我尝试了多个代码，但是DIV中的每个元素的不透明度都改变了。希望你能帮助我

我试图更改文档。getElementsByTagName（'article'）[i]由document.getElementsByTagName（'img'）[i]创建，但它只是在鼠标悬停在图像上时更改了图像的不透明度。 我尝试了document.getElementsByTagName（'article'）[I].getElementsByTagName（'img'）[I]和以前一样。 我试着改变这个风格，但什么都没发生

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;
}

对于（var i=0；i请尝试使用querySelectorAll（“文章img”）而不是getElementsByTagName。这只会影响文章内部的img。
我不确定您想要什么，但请检查以下内容：

HTML

JS

感谢各位，事实上，最后我改成了css，它工作得非常好。很抱歉，作为一个无事生非的人，我说这不起作用。我把我的文章（DIV）命名为“爸爸”，把我的图片命名为“孩子”

天哪，这太简单了，我的生活复杂了很多。
这是我的最终代码：

.Dad:hover .Child {
  opacity: 1;
}

有什么原因不能用CSS改变不透明度吗？事实上，我想让它工作不，因为我不能用CSS改变不透明度，但这是因为我希望我的网站可以这样。谢谢使用
：hover
的纯CSS解决方案会是一个更好的方法。对不起，当鼠标在图像上时它会修改。我希望鼠标在图像上时我会这样做文章中的图片都被修改了谢谢你它终于起作用了！！但是我修改了一点^（不确定）如果您使用纯CSS，容器中的所有内容都将不透明度：文本、图像、容器和容器内的每个项目Aziutus抱歉，但它实际上工作得更好。事实上，现在我的鼠标在容器上移动只是图像更改。但它发生在所有容器中，我只希望它发生在容器中。我的鼠标在容器上。而不是我在s上移动第二，它不会对图像产生任何影响
.container{
    background: #d87300;
}

.half-transparent{
    opacity: 0.5;
}

const images = [...document.querySelectorAll('.container img')]
const container = document.querySelector('.container')

container.addEventListener('mouseenter', ()=>{
    images.forEach(element => {
        element.classList.add('half-transparent')
    })
})

container.addEventListener('mouseleave', ()=>{
    images.forEach(element => {
        element.classList.remove('half-transparent')
    })
})

.Dad:hover .Child {
  opacity: 1;
}