Javascript 加载位于不同目录中的html页面

我有一个页面，当点击链接时，额外的HTML将加载到该页面。我要加载的HTML片段文件位于项目中的另一个文件夹中。如果没有找到404，我无法完成.load部分。单击链接时我所在的页面为“http://localhost:8000/esr_dashboard/request_details/469/". 当我点击链接时，它返回404，并带有“http://localhost:8000/esr_dashboard/request_details/469/esr_dashboard/esr_msg_detail.html"

js文件和所需html文件的文件夹结构如下。注意，我正在做一个django项目

EGHub (django project)
├── esr_dashboard (app folder)
│   ├── templates
│       ├── esr_dashboard
│           ├── esr_msg_detail.html
├── static
│   ├── js
│       ├── script.js

$（.msg\u detail\u link）.on（'click'，函数（e）{
e、 预防默认值（）；
变量id=$（this.attr（“数据id”）
控制台日志（id）
$.get（'/esr_仪表板/请求_消息_详细信息/'+id+'/'，
功能（数据、状态）{
obj=JSON.parse（数据）
//测试以确认数据是否良好
console.log（obj[0].fields.first\u name+“”+obj[0].fields.last\u name）
});
$（“#row_msg_detail”）.load（'./esr_msg_detail.html'）
});

您需要使用html片段的相对路径，浏览器将尝试在当前目录中查找您的文件，但找不到，并返回404

如果您的文件结构是：

├─script.js
├─subdirectory
│ ├─fragment.html

您需要将其引用为

”/subdirectory/fragment.html“

编辑：如果您的文件位于文件树上方的目录中，则使用“

”。/“

向上移动目录

---

因此，对于您的情况，您需要的是：

“../../esr_dashboard/templates/esr_dashboard/esr_msg_detail.html”

，两个“../”，因为您要从js/转到static/，从static/转到EGHub/

，当我单击链接时，它会返回404，其中包含以下内容，然后您需要使用“/esr_dashboard/est_msg_detail.html”，正如我在回答中所说，您需要指定精确的路径，而不仅仅是给它文件名。浏览器将在与脚本相同的目录中查找文件，但找不到，因此您需要告诉浏览器在子目录中查找。我根据您最初的建议编辑了我的问题。我正在努力告诉浏览器“返回”到树上以获得所需的目录。哦，我明白了，我编辑了答案以适应您的问题。我将在控制台404中遇到类似错误（未找到）。请尝试使用此代码段

$（“#row_msg_detail”）.load（'/esr_dashboard/templates/esr_dashboard/esr_msg_detail.html'）