img onClick“”不起作用？ [复制]答案

【问题标题】：img onClick"" doesn't work? [duplicate]img onClick“”不起作用？ [复制]
【发布时间】：2017-02-10 23:34:32
【问题描述】：

HTML

<img src="http://i.pr3cast.pw/02.09.10z.png" onClick="disappear()">

function disappear() {
document.getElementsByTagName("img").style.display = "none"; 
}

https://jsfiddle.net/1y42d7zm/

当我点击时图像没有任何反应:(

控制台说：未捕获的类型错误：无法设置未定义的属性“显示”

谢谢

【问题讨论】：

.getElementsByTagName() 函数返回元素的列表，即使页面上只有一个匹配元素。
o.o 那我应该用什么？
你可以使用它，但你必须从列表中提取实际的目标图像。具体如何执行取决于 HTML。

标签： javascript html function onclick display

【解决方案1】：

(function(){
  window.disappear = function() {
     console.log("dissapear");
     document.getElementsByTagName("img")[0].style = "display: none;"; 
  };
 }());

你几乎拥有它。正如其他人所提到的， document.getElementsByTagName 返回一个数组；你必须指定你想要的元素[0]。

我将您的消失功能更改为绑定到窗口，因为我无法通过我的 CodePen 访问它。闭包 (function(){}()) 使得代码在 dom 准备好时运行。

CodePen

【讨论】：

不，你的代码也不能工作，原因与 OP 代码不能工作的原因完全相同。
请不要遗漏分号。
当你可以使用 Stack Snippet 时，不要使用 CodePen。
你应该解释你改变了什么以及为什么，而不仅仅是发布挑战读者理解原因的代码。
@Barmar 堆栈片段？ :S 我在哪里使用它？

【解决方案2】：

HTML：

<img id="to-disappear" src="http://i.pr3cast.pw/02.09.10z.png"         onClick="disappear()">

JS：

function disappear() {
    document.getElementById("to-disappear").style.display = "none";
}

【讨论】：

它必须使用一个ID？我试图避免这种情况，如果我想为所有元素设置动画，我不想标记每一个 img 元素，我很确定一定有不同的方式，对吧？
@PrecastDragon 不同的方式在另一个答案中。
您必须自己对匹配的元素集进行迭代。