Atom：将代码放在正文 HTML 上后，Javascript 显示“ReferenceError：文档未定义”答案

【问题标题】：Atom: Javascript shows "ReferenceError: document is not defined" after putting code on body HTMLAtom：将代码放在正文 HTML 上后，Javascript 显示“ReferenceError：文档未定义”
【发布时间】：2021-02-12 19:34:38
【问题描述】：

Javascript 脚本显示：

ReferenceError: 运行此代码时未定义文档

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 时，点击事件不会触发任何内容。如何将我的两个文件合二为一？将“脚本”与源代码放在一起后有什么问题？

【问题讨论】：

可能是因为 Atom 没有文档，但您的代码在浏览器中运行良好。检查控制台是否有错误。您的 js 文件路径可能有误。
@Gwen Lee 收到错误时是如何运行它的？
@Aalexander 我使用了来自 atom-ide-community 的“脚本”包安装 - 并使用了运行脚本

标签： javascript html atom-editor

【解决方案1】：

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

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

You can learn more about the document object here

【讨论】：