试图通过使用javascript单击图像来设置图像的不透明度，但不断出现错误

我试图通过使用javascript单击图像来更改图像的不透明度，但不断出现以下错误（我也是javascript新手）：

未捕获的TypeError:无法读取的属性“getElementsByTagName” HtmlLevel.thumbnails处为null。（匿名函数）。onclick

let thumbnails=document.querySelectorAll（“.thumbnails”）；
for（设i=0；i}

您已经有了对缩略图元素的引用，因此不需要通过id获取它。您需要类似以下内容：

let thumbnails=document.querySelectorAll（“.thumbnails”）；
for（设i=0；i

返回类似节点列表的数组

---

您不能使用getElementsByTagName，您可能希望迭代该数组并在每个元素中查找子元素。为此，您需要再次使用查询选择器。

缩略图[i]已经是一个元素，无需

getElementById

， 因此，考虑到您已经有了父元素，请使用

firstElementChild

let thumbnails=document.querySelectorAll（“.thumbnails”）；
for（设i=0；i

---

如果

。缩略图

是图像的父元素的类别：

let thumbnails=document.querySelectorAll（“.thumbnailimg”）；
for（设i=0；i

缩略图{
宽度：50px；
高度：50px；
填充物：5px；
}

---

您正在将变量

缩略图[i]

传递给方法

文档.getElementByID

其次

getElementsByTagName

返回元素集合。如果.缩略图中只有1个img，则使用

querySelector（'img'）

如果有更多img，则在整个数组中循环。
以下示例仅考虑

中的1个
img
。缩略图

let thumbnails = document.querySelectorAll(".thumbnail");
for (let i = 0; i < thumbnails.length; i++) {
    thumbnails[i].onclick = function () {
        thumbnail[i].querySelector('img').style.opacity = 1;
    }
}

let thumbnails=document.querySelectorAll（“.thumbnails”）；
for（设i=0；i

您的剩余代码在哪里？添加您的html或其部分此答案最适合我。谢谢！但是如果我想让图像完全不透明呢？无论何时我尝试将其设置为1，它都不会改变。在我的示例中，它们开始完全不透明，这就是为什么我在单击时将其设置为0.5以显示差异。你可以把它调换一下，用CSS将它们的样式设置为略微透明，然后在JS中设置为不透明。显然

thumbnail

是图像的父元素类