js开关灯案例
时间: 2023-07-23 09:13:32 浏览: 102
JavaScript实现电灯开关小案例
以下是一个基于JavaScript的简单开关灯案例:
HTML部分:
```
<!DOCTYPE html>
<html>
<head>
<title>开关灯</title>
</head>
<body>
<button onclick="switchLight()">开关灯</button>
<img id="myImage" src="light_off.png">
<script src="switchLight.js"></script>
</body>
</html>
```
JavaScript部分(switchLight.js):
```
function switchLight() {
var image = document.getElementById("myImage");
if (image.src.match("light_off")) {
image.src = "light_on.png";
} else {
image.src = "light_off.png";
}
}
```
在这个案例中,我们使用了一个按钮和一个图片。当按钮被点击时,我们调用了`switchLight()`函数。这个函数会获取图片元素,然后检查它的`src`属性是否包含“light_off”字符串。如果包含,就将它的`src`属性修改为“light_on.png”,灯就亮了;如果不包含,就将它的`src`属性修改为“light_off.png”,灯就灭了。
阅读全文