HTML vs Javascript ..文件路徑圖像如何工作？

我注意到，在HTML中，圖像源始於我的頁面位置（基底）所在的位置。所以，如果我的圖片或圖像是在另一個文件夾，我可以短手SRC說以下內容：HTML vs Javascript ..文件路徑圖像如何工作？

<img src="avatars/dwarf14.jpg">

不過我在javascript注意到，我不能做同樣的事情。我必須輸入我的整個C目錄才能找到相同的圖像。爲什麼是這樣？我認爲我的圖像路徑的起始位置將是我的JavaScript文件所在的位置。

dom.el("playeravatar").innerHTML = '<img src="C:/Users/Q/Desktop/Gaming Project/avatars/warrior4.jpg">';

來源

2015-12-17 Shawn

我認爲你在這裏混淆客戶端（瀏覽器）和服務器。我認爲你的錯誤是你沒有配置你的Web服務器指向圖像文件夾。 –

請注意，前導斜槓表示絕對值相對值。 'avatars/img.jpg'與'/ avatars/img.jpg'不一樣。 – Phix

腳本只是增加了一個img標籤的DOM。然後瀏覽器將解析這個標籤，就像硬編碼或通過任何其他方式添加的標籤。如何將src屬性解釋爲與javascript無關。

由於這個原因，在javascript文件所在的位置沒有興趣。您的路徑應該與您插入圖像的文檔相關。

來源

2015-12-17 05:51:08

沒有它不是你的圖像路徑起始位置的case.The將是HTML頁面裏的.js文件加載:)

來源

2015-12-17 05:51:46 AkshayJ

<img id='img' src='img.jpg' style="max-height: 200px; max-width:200px" /> <br /> 
<img id='imgJS' style="max-height: 100px; max-width:100px" /> <br /> 
<div id='divJS' /> 
<script type="text/javascript"> 
    document.getElementById('imgJS').src = 'img.jpg'; 
    document.getElementById('divJS').innerHTML = '<img src="img.jpg" style="max-height: 50px; max-width:50px" /> <br />'; 
</script>

我能夠從JavaScript加載圖像。上面的代碼在img標籤上設置了相同的圖像，並在div標籤內添加了一個新的img標籤，並使用不同的尺寸進行區分。將此代碼和圖像放在同一個文件夾中，它可以工作。

大衛給了一個恰當的解釋。 DOM處理路徑，並且與文檔相關，而不是JavaScript文件。

來源

2015-12-17 06:31:07

HTML vs Javascript ..文件路徑圖像如何工作？

回答

相關問題