外部 JS 文件在我的 HTML 文件中不起作用答案

【问题标题】：External JS file not working within my HTML file外部 JS 文件在我的 HTML 文件中不起作用
【发布时间】：2019-01-08 05:21:54
【问题描述】：

JS 新手，正在处理 D3 可视化，当我提供包含 JS 脚本的 html 文件时：

<script src="visualization.js" type="text/javascript"></script>

我最终收到此错误消息：

加载资源失败：服务器响应状态为 404 （未找到）visualization.js:1 加载资源失败：服务器响应状态为 404（未找到）

我已经尝试了以下在本网站和其他网站上找到的建议解决方案，但似乎没有任何效果。我试过了：

通过使用正确的目录尝试 Map1/visualization.js 和其他变体，使路径更加详细。
清除缓存和所有浏览数据。
将 js 文件放在与 HTML 文件相同的目录中（从一开始就这样做）

有人知道解决方案吗？不知道出了什么问题。

我的html文件代码：

<!doctype html>
<html>
<head>
    <meta charset= "utf-8">
    <style>
        *{
            font-family: "Helvetica Neue";

        }
        p {
            font-size: 0.85em;

        }
        svg {
            background: #efefef;
        }
    </style>
</head>
<body>

    <div id="map"></div>

    <!-- Socket io !-->
    <script src="/socket.io/socket.io.js"></script> 

    <!-- D3 Link !-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.2.2/d3.min.js"></script>

    <!-- Topojson library !-->
    <script src="http://d3js.org/topojson.v1.min.js"></script>

    <!-- Visualization file -->
    <script src="visualization.js" type="text/javascript"></script>

</body>
</html>

这个项目的所有文件都在 Map1 目录中。

Map1:
  -map1.html
  -package.json
  -server1.js -> the file to that serves my html file
  -visualization.js
  -world.topojson``

【问题讨论】：

使用 js 引用和文件夹结构添加您的 HTML 代码
您是否使用 Node.js 来提供文件？你用什么命令来启动网络服务器？
顺便说一句，您可以删除type="text/javascript"。 <script> 标签已经使用 text/javascript 作为它们的默认 type，使得这个属性的包含是多余的。
是的，我正在使用 Node.Js 来提供文件。这些是我正在使用的命令：npm install --save express@4.15.2 -> npm install --save socket.io -> npm i nodemon -g -> nodemod Map1/server1.js。 js 文件是我使用 Node.js 来服务器，html 文件与我的 html 文件和给我错误的 js 文件位于同一目录中。

标签： javascript html d3.js

【解决方案1】：

听起来您正在从与 HTML/JS 文件存储位置不同的工作目录运行服务器。如果你有这个目录结构：

app
 └── static
      ├── index.html
      └── visualization.js

...并且您已经从app 目录启动了服务器，那么浏览器将在此处查找visualization.js：

app
 ├── static
 │    └── ...
 │   
 ├── index.html
 └── visualization.js <-

确保从包含 visualization.js 的同一目录运行服务器。

【讨论】：

【解决方案2】：

确保您的 Java 脚本文件“visualization.js”仍然存在或检查根据您的说法，“visualization.js”应该位于与您的 html 相同的目录中文件位于。但如果这不是导致 404 错误的原因。我建议你检查您的“visualization.js”文件当前存在的目录。试试这个；

例如：-

这里我的意思是“目录”是你的visualization.js当前所在的目录。

【讨论】：

【解决方案3】：

我有几个：

尝试将 './visualization.js' 放入 src。
检查拼写。
将此行放在标记的末尾。

【讨论】：

【解决方案4】：

您可以使用 npm 包assets。

使用后可以使用resolver.path()方法。

现在，不要这样写：

var url = '/assets/images/icons/create.png';

你可以这样写：

var url = resolver.path('icons/create.png');

【讨论】：