<!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>