用一個函數（JavaScript）交換一個img src

Question

我想在我的網頁中交換兩個imgs，並且無法包裝我的頭爲什麼此代碼不起作用。任何幫助，將不勝感激。

這是在HTML文件中：

<img onclick="swap(); "src="LaptopThin.jpg" id="LaptopPicture" /> 

，而這是在一個單獨的JavaScript文件：

function swap() 
    { 
    var picture = document.getElementById('LaptopPicture').src; 
    if (picture === 'LaptopThin.jpg') { 
     picture.src = 'ServerRack.jpg'; 
    } else { 
     picture.src = 'LaptopThin.jpg'; 
    } 

我改變了代碼：

 function swap() 
    { 
    var picture = document.getElementById('LaptopPicture'); 
    if (picture.src === 'LaptopThin.jpg') { 
     picture.src = 'ServerRack.jpg'; 
    } else { 
     picture.src = 'LaptopThin.jpg'; 
    } 
    } 

和圖片在html文件中仍然沒有改變。在IMG停留在Laptopthin.jpg

Answer 1

這是因爲，在src特性具有圖像源的絕對值不只是src屬性

function swap() { 
    var picture = document.getElementById('LaptopPicture'); 
    if (picture.src.indexOf('LaptopThin.jpg') > -1) { 
     picture.src = 'ServerRack.jpg'; 
    } else { 
     picture.src = 'LaptopThin.jpg'; 
    } 
} 

---

另一個選項的值設置爲嘗試是使用的getAttribute

function swap() { 
    var picture = document.getElementById('LaptopPicture'); 
    if (picture.getAttribute('src')== 'LaptopThin.jpg') { 
     picture.src = 'ServerRack.jpg'; 
    } else { 
     picture.src = 'LaptopThin.jpg'; 
    } 
} 

Answer 2

你不能設置的picture的src屬性，因爲你設置picture到src已經有一個元素的屬性。

更改這些行：

var picture = document.getElementById('LaptopPicture').src; 
if (picture === 'LaptopThin.jpg') { 

這些：

var picture = document.getElementById('LaptopPicture'); 
if (picture.src === 'LaptopThin.jpg') {