在Javascript中交換圖片，如何重置src？

Question

你好，我想，當圖像和後用戶mousovers他mousleavs重置圖片src改變形象，但它不工作 這是我的html代碼：

<img id="myImage" onmouseover="changeImage()" onmouseleave="resetImage()" src="pic_bulboff.gif" width="100" height="180"> 

和JS：

<script> 
function changeImage() { 
    var image = document.getElementById('myImage').image.src = "pic_bulbon.gif";  
} 

function resetImage() { 
    var image = document.getElementById('myImage').image.src = "pic_bulboff.gif"; 
} 
</script> 

Answer 1

你混合的東西了..

使用document.getElementById('myImage').src = "pic_bulbon.gif";

____^^--------DOM Element-----------^^_Property_^^--Value--^^

試試這個：

function changeImage() { 
 
    document.getElementById('myImage').src = "pic_bulbon.gif"; 
 
} 
 

 
function resetImage() { 
 
    document.getElementById('myImage').src = "pic_bulboff.gif"; 
 
}

[src="pic_bulbon.gif"] { 
 
    border: 2px solid black; 
 
} 
 
[src="pic_bulboff.gif"] { 
 
    border: 2px solid red; 
 
}

<img id="myImage" onmouseover="changeImage()" onmouseleave="resetImage()" src="pic_bulboff.gif" width="100" height="180">