JavaScript中图像的文件路径答案

【问题标题】：File Path in JavaScript for imagesJavaScript中图像的文件路径
【发布时间】：2016-06-10 06:25:44
【问题描述】：

这可能是最微不足道的问题，但据我了解，这似乎是正确的，但我无法按需要查看图像。该图像显示了文件结构，我正在尝试从 jsGold.js 文件中访问这些文件。在我将某些文件提取到新项目进行清理之前它工作正常，因此我怀疑文件路径的更改可能导致了这个问题。

jsGold.js 文件中的代码行：

else {
   streamData.push(clickedId, streamName, streamDef);
   var prop = $('<img class="prop" src="../../Images/prop.ico" />').attr('id', i);
   newAgent.text(streamData[nameIndex]).append('<img class="cancel" src="../../Images/delete.ico"/>').append(prop);

我得到的输出是：

期望的输出：

【问题讨论】：

我希望src 路径应该相对于运行 JS 的当前页面，而不是相对于 JS 文件的位置。所以src="../Images/prop.ico".
路径是相对于执行JS的文件，而不是JS文件本身。因此，例如，如果您的 JS 文件包含在 checkon.html 中，则路径将为 ../Images/prop.ico。
为什么不使用（根）相对 URL，即 /Images/prop.ico ？这种方式更容易读取路径，无论javascript/html文件位置如何，路径都是一样的。
Christophe- 谢谢，这行得通。

标签： javascript jquery image filepath

【解决方案1】：

img 标签的相对路径应该是相对于你网站的根目录，而不是相对于你的脚本文件夹。

你应该使用：

var prop = $('<img class="prop" src="/Images/prop.ico" />').attr('id', i);

如果您从Views 直接从您的磁盘而不是从网络服务器打开页面，则相对路径必须相对于Views 文件夹。所以你必须这样写：

var prop = $('<img class="prop" src="../Images/prop.ico" />').attr('id', i);

【讨论】：

“你的 img 标签的相对路径是相对于你网站的根目录的” - 如果它以../ 开头，则不是。
是否依赖于加载的html页面？
@Teja 不，因为如果它以/ 开头，它指的是您网站的根目录。现在如果你直接从磁盘打开你的 html 页面，那就是另一回事了……
@nnnnnn 输入错误。将is 替换为should be。
您使用../ 的第二个版本也应该可以在网络服务器上运行。但是，如果您移动 html 文件，使用 / 从根目录开始无需更新路径。

【解决方案2】：

谢谢大家 - 自从我在视图中从 work.html 打开文件后，以下工作正常

var prop = $('<img class="prop" src="../Images/prop.ico" />').attr('id', i);

【讨论】：