外部 Javascript 文件在 HTML 中不起作用

Question

This is extremely basic but I'm unsure why this has stopped working.这是非常基本的，但我不确定为什么这已经停止工作。 I have the following html file我有以下 html 文件

<html>
<!doctype html>
<head>
  
   <script> document.write("this is working")</script>
   <p>this is working</p>

</head>
<body>
    <script src="test.js"></script>
</body>
</html>

and the following javascript file that is in the same folder as the html file以及与 html 文件位于同一文件夹中的以下 javascript 文件

document.write("Hello World!");

The scripts and html within the html document work fine. html 文档中的脚本和 html 工作正常。 However, the external javascript file does not get executed.但是，不会执行外部 javascript 文件。 I have tried with a variety of scripts in the js file and minor modifications to the html file.我在 js 文件中尝试了各种脚本并对 html 文件进行了微小的修改。 On a windows 10 computer.在 Windows 10 计算机上。

Note this is not a repeated question, the other questions similar to this one were slightly different.请注意，这不是一个重复的问题，与此类似的其他问题略有不同。

EDIT: Error in browser console states "not allowed to load local source" This may be a chrome security issue.编辑：浏览器控制台中的错误状态“不允许加载本地源”这可能是 chrome 安全问题。 EDIT: Same case in all browsers so doesn't seem purely related to chrome.编辑：所有浏览器中的情况相同，因此似乎与 chrome 并不完全相关。 Attempted all the fixes I could find but did not work.尝试了我能找到的所有修复程序，但没有奏效。

EDIT: I tried using both node and python for the server.编辑：我尝试在服务器上同时使用 node 和 python。

Answer 1

Looks like you're loading the HTML file through file protocol (ie double-clicking the file and opening it in a browser).看起来您正在通过文件协议加载 HTML 文件（即双击文件并在浏览器中打开它）。 In that case, browser may deny to load any external resources ( test.js script in your case) due to security.在这种情况下，出于安全考虑，浏览器可能会拒绝加载任何外部资源（在您的情况下为test.js脚本）。 Load the HTML through HTTP protocol.通过 HTTP 协议加载 HTML。 It can be achieved numerous ways.它可以通过多种方式实现。

If you have PHP installed, simply running php -S localhost:80 within the project directory will spin up a local server, which you can browse by visiting http://localhost .如果您安装了PHP ，只需在项目目录中运行php -S localhost:80启动本地服务器，您可以通过访问http://localhost进行浏览。 It will then serve the index.html page by default.默认情况下，它将为index.html页面提供服务。
If you have Node.js installed (thus npm , too), install http-server globally ( npm i http-server -g ).如果您安装了Node.js （因此也安装了npm ），请全局安装http-server ( npm i http-server -g )。 And afterthat, run http-server within the project directory.之后，在项目目录中运行http-server 。 By default, it will spin up a local server on port 8080 , so you'll be able to visit http://localhost:8080 and index.html will be served.默认情况下，它将在端口8080上启动本地服务器，因此您将能够访问http://localhost:8080并提供index.html 。

I tried the later one, and your above code worked perfectly fine.我尝试了后一个，你上面的代码工作得很好。

Answer 2

This is not a solution, but it is a work around if anyone has the same issue and a better answer is not produced.这不是一个解决方案，但如果有人遇到同样的问题并且没有产生更好的答案，它是一种解决方法。

Get the chrome extension "web server" and open that rather than running it through node, python, etc.获取 chrome 扩展“网络服务器”并打开它，而不是通过 node、python 等运行它。

外部 Javascript 文件在 HTML 中不起作用

问题描述

2 个解决方案

解决方案1
1 2021-10-16 05:58:12

解决方案2
-2 2021-10-16 06:35:55

外部 Javascript 文件在 HTML 中不起作用

问题描述

2 个解决方案

解决方案1 1 2021-10-16 05:58:12

解决方案2 -2 2021-10-16 06:35:55

解决方案1
1 2021-10-16 05:58:12

解决方案2
-2 2021-10-16 06:35:55