javascript - 在querySelector上获取空值

我尝试从Mozilla的Java入门教程中复制粘贴代码

var myImage = document.querySelector('img');

myImage.onclick = function() {
    var mySrc = myImage.getAttribute('src');
    if(mySrc === 'images/firefox-icon.png') {
      myImage.setAttribute ('src','images/firefox2.png');
    } else {
      myImage.setAttribute ('src','images/firefox-icon.png');
    }
}

我收到错误消息“无法将属性'onclick'设置为null”。怎样纠正密码？

我刚刚开始使用javascript。如果这是我的愚蠢错误，请原谅我。

最佳答案

您可能试图在呈现元素之前分配单击处理程序，以使查询选择器找不到img标签。页面呈现后尝试执行脚本

window.onload = function () {
    var myImage = document.querySelector('img');

    myImage.onclick = function() {
        var mySrc = myImage.getAttribute('src');
        if(mySrc === 'images/firefox-icon.png') {
          myImage.setAttribute ('src','images/firefox2.png');
        } else {
          myImage.setAttribute ('src','images/firefox-icon.png');
        }
    }
}

关于javascript - 在querySelector上获取空值，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/34118262/