js事件实现的一些简单效果及灯泡点击

最新推荐文章于 2022-11-22 19:41:57 发布

[body]

最新推荐文章于 2022-11-22 19:41:57 发布

阅读量359

点赞数 1

本文链接：https://blog.csdn.net/qq_45743129/article/details/102702974

版权

本文介绍了使用JavaScript实现的一些简单效果，重点展示了如何通过JS代码创建一个灯泡点击开关效果。文章提供了相应的HTML代码和实际效果的图片展示，帮助读者理解并实践这一互动功能。

摘要由CSDN通过智能技术生成

1.用js实现的一些简单效果

HTML代码

	<body>
	<div style="width: 400px;height: 600px; " >
<table border="0" cellpadding="0" cellspacing="0" width="100%">
    <tr>

        <td style="text-align: left"><img id="rope" src="a1.jpg" width="120" height="400" onclick="changeRope()"></td>
        <td style="text-align: center">
            <img id="myimage" src="pic_bulbon.gif" width="150" onclick="changeImage()" height="300">

            <img id="swit" onclick="changeSwitch()" src="turnOff.png" width="50" height="80" />
        </td>


    </tr>
</table>
<p id="time"></p>

	</body>

<script type="text/javascript">

        function changeImage()
        {
   
            //灯泡点击
            element=document.getElementById('myimage');

            if (element.src.match("bulboff"))
            {
   
                //判断灯泡是打开还是关闭

                element.src=