JavaScript 改变 HTML显示图片 实现开光灯效果

JavaScript 改变 HTML显示图片 实现开光灯效果

javascript教程qingyu2021-06-03 21:34:437A+A-

  JavaScript 改变 HTML显示图片

  本例要实现点击按钮开关灯的效果。其实是javascipt通过改变标签的 src 属性(source)来改变一张 HTML 图像。

  实例代码:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript 能做什么?</h2>

<p>JavaScript 能够改变 HTML 属性值。</p>

<p>在本例中,JavaScript 改变了图像的 src 属性值。</p>

<button onclick="document.getElementById('myImage').src='img/1.gif'">开灯</button>

<img id="myImage" border="0" src="img/1.gif" style="text-align:center;">

<button onclick="document.getElementById('myImage').src='img/2.gif'">关灯</button>

</body>
</html>


  运行结果:

JavaScript 改变 HTML显示图片 实现开光灯效果

点击这里复制本文地址 欲穷千里目,更上一层楼

支持Ctrl+Enter提交
qrcode

小黄鸡毕业设计网 © All Rights Reserved.  Copyright Your WebSite.Some Rights Reserved.
Powered by Z-BlogPHP
联系我们| 关于我们| 留言建议| 网站管理