javascript - JavaScript insideHTML 到图像替换的问题

Question

我是 JavaScript 新手，正在为一个类(class)做一个项目。我想在页面上的某个位置创建一个复活节彩蛋，单击该彩蛋时会将整个页面代码更改为单个图像。这是我的代码，只是为了测试这个概念:

<div id = "all">
    <p>The button below changes the whole page.</p>

    <button type = "button" onclick = "changePage()">Click Here</button>
</div>

<script>
    function changePage()
    {
        document.getElementById("all").innerHTML = "<img src = "stop.jpg" />";
    }
</script>

内容不会被图像 stop.jpg 替换，但是当我将行更改为:

document.getElementById("all").innerHTML = "<h1>Whatever</h1>";

代码更改为简单标题没有任何问题。知道为什么吗？

Answer 1

您没有注意到引号在重复吗？您应该用另一个引号将您的 img 括起来:

'<img src = "stop.jpg" />'

或者逃离他们

"<img src = \"stop.jpg\" />"