JS效果日记（二）

最新推荐文章于 2023-11-24 19:20:50 发布

Alex__Jie

最新推荐文章于 2023-11-24 19:20:50 发布

阅读量83

点赞数

文章标签： js html

本文链接：https://blog.csdn.net/qq_45842320/article/details/110181983

版权

JS效果日记（二）

*图片的点击显示和隐藏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<button id="btn">隐藏</button>
		<br/>
		<img src="img/1119.jpg">
		<script>
			var Btn = document.getElementById('btn');
			var photo = document.getElementsByTagName('img')[0];
			Btn.onclick = function()  {
				if(Btn.innerHTML === '隐藏') {
					Btn.innerHTML = '显示';
					photo.style.display = 'none';
				}else {
					Btn.innerHTML = '隐藏';
					photo.style.display = 'block';
				}
			}
		</script>
	</body>
</html>