爲什麼下面的代碼不能按預期執行？

<!DOCTYPE html> 
<html> 
<body> 

<img id="image" src="smiley.gif" width="160" height="120"> 

<script> 
function myFunction() 
{ 
    var img = document.getElementById("image"); 
    if (img.src == "smiley.gif") 

    document.getElementById("image").src="landscape.jpg"; 
    else 
    document.getElementById("image").src="smiley.gif"; 
} 
</script> 
<button type="button" onclick = "myFunction()"> click me </button> 
<p>The original image was smiley.gif, but the script changed it to landscape.jpg</p> 

</body> 
</html>

我想讓HTML頁面在每次用戶點擊按鈕時在兩張圖片之間切換，但圖片永遠不會改變。爲什麼下面的代碼不能按預期執行？

當我改變

if (img.src == "smiley.gif")

到

if (img.src.match("smiley.gif"))

然後代碼工作正常。

請問誰能讓我知道原因？

來源

2014-04-10 bean

的文件名是隻存儲在'src' ......這就是它的完整URL的一部分。因此，即使您將'src'設置爲文件名，它也會存儲完整的URL – devnull69

要查看原因，請在'if ...'之前添加'alert（img.src）'以查看'img.src中的實際內容'。 –

@ devnull69謝謝男人！我認爲這可能是我錯過的觀點。 – bean

devnull69是對的。如果將img的源設置爲相對路徑，則它的src屬性仍將返回完整的URL。您需要完全限定圖像的路徑，或者將img.src的值剝離爲最終組件（文件名）並進行比較。

例如，你可以這樣做：

var imgFilename = img.src.substring(img.src.lastIndexOf("/") + 1); 
if (imgFilename === "smiley.gif") { 
    // Do something. 
}

來源

2014-04-10 13:15:33 FreeAsInBeer

爲什麼下面的代碼不能按預期執行？

回答

相關問題