Atom: Javascript shows "ReferenceError: document is not defined" after putting code on body HTML

Question

Javascript 脚本显示：

ReferenceError: document is not defined when I run this code

ReferenceError

HTML 和 JS:

const button = document.querySelector('#click')

button.addEventListener('click',()=>{
  alert('clicked')
})

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>practice</title>
  </head>
  <body>
    <button type="button" id="click" name="button">click me</button>
    <script src="Pracitce.js" charset="utf-8"></script>
  </body>
</html>

另外，当我在 Chrome 浏览器上运行 HTML 时，点击事件没有触发任何东西。如何将我的两个文件合二为一？将 'script' 与来源放在一起后有什么问题？

Answer 1

您的浏览器 window 对象中有文档属性，您需要 link 您的 JS 文件和 HTML 文件，然后运行您的HTML 文件并在浏览器中查看输出。

您还可以在浏览器中使用 console 来运行您的示例 JS 代码。

You can learn more about the document object here

Atom: Javascript shows "ReferenceError: document is not defined" after putting code on body HTML

Atom: Javascript shows "ReferenceError: document is not defined" after putting code on body HTML

html

javascript

atom-editor