给标签添加onchange事件_Js -- 事件应用案例

最新推荐文章于 2022-02-12 08:58:47 发布

weixin_39710106

最新推荐文章于 2022-02-12 08:58:47 发布

阅读量1.2k

点赞数

文章标签：给标签添加onchange事件

本文链接：https://blog.csdn.net/weixin_39710106/article/details/112617433

版权

Ⅰ 开关灯案例

点击按钮实现团变色

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>开关灯案例</title>
    <style>
        #d1 {
           height: 200px;     width: 200px;      border-radius: 50%;      }
        .box1 {
        background-color: red;        }
        .box2 {
       background-color: yellow;        }
    </style>
</head>
<body>
<div id = 'd1' class="box1 box2"></div>
<button id = 'd2'>点我有你好看</button>
<script>
    let idEle = document.getElementById('d2')
    let divEle = document.getElementById('d1')
    idEle.onclick = function () {
    
        divEle.classList.toggle('box2')
    }
</script>
</body>
</html>

Ⅱ input框获取焦点失去焦点案例

鼠标不在输入框,默认显示自定义的值
鼠标点击输入框后,清空输入框内的值

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_39710106

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
给标签添加onchange事件_Js -- 事件应用案例

Ⅰ 开关灯案例点击按钮实现团变色<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>开关灯案例</title> <style> #d1 { height: 200px; ...
复制链接

扫一扫