js圖片顯示隱藏

NO IMAGE

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js圖片顯示隱藏</title>
<script>
window.onload = function () {
//獲取按鈕
var btn = document.getElementsByTagName("input")[0];
//獲取圖片
var img = document.getElementsByTagName("img")[0];
//給按鈕新增事件
btn.onclick = function () {
//點選按鈕隱藏圖片 或者顯示圖片
//改變按鈕的文字
//如果是隱藏,就改成顯示,如果是顯示就改成隱藏
//圖片的處理 :如果按鈕文字是顯示,圖片顯示出來,否則隱藏
if (btn.value == "顯示"){
btn.value = "隱藏";
img.style.display = "block";
}else {
btn.value = "顯示";
img.style.display = "none";
}
}
}
</script>
</head>
<body>
<img src="image/0.jpg"/>
<br/>
<input type="button" value="隱藏"/>
</body>
</html>