<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
var flag = 1;
function change(){
var img = document.getElementById("img");
var text = document.getElementById("text");
switch(flag){
case 0: img.src = "img/伞.png"; flag++; text.innerHTML = "雨伞~~"; break;
case 1: img.src = "img/冰棍.png"; flag++; text.innerHTML = "冰棍~~"; break;
case 2: img.src = "img/冰淇淋.png"; flag++; text.innerHTML = "冰淇淋~~"; break;
case 3: img.src = "img/冰箱.png"; flag++; text.innerHTML = "冰箱~~"; break;
case 4: img.src = "img/水.png"; flag = 0; text.innerHTML = "水~~"; break;
}
}
</script>
</head>
<body>
<input type="button" value="img" onclick="change()" style="width:60px;height: 40px;background-color:mediumseagreen;color: white;font-size: 20px;border: 0px;"/>
<br />
<br />
<img style="width: 120px;" id="img" src="img/伞.png" />
<p id="text" style="font-size: 30px;font: '黑体';color: dodgerblue;" ><b>雨伞~~</b></p>
</body>
</html>
点击按钮更换图片 - HTML
猜你喜欢
转载自blog.csdn.net/qq_42108487/article/details/80875817
今日推荐
周排行