排他思想

2019-05-10  本文已影响0人  椋椋夜色

<!DOCTYPE html>
<html lang="zh-CN">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title> 排他思想 </title>

<style>
    .box {
        background-color: rgb(241, 11, 11);
    }
</style>

</head>

<body>

<!-- 排他思想:先把大家恢复成默认,再让自己特殊 -->

<input type="button" value="点我啊">
<input type="button" value="点我啊">
<input type="button" value="点我啊">

<script>
    // 找到所有按钮
    var inList = document.getElementsByTagName('input');
    // 遍历所有按钮加点击事件
    for (var i = 0; i < inList.length; i++) {
        inList[i].onclick = function () {
            // 先把兄弟们都恢复成默认的
            for (var j = 0; j < inList.length; j++) {

                inList[j].className = "";
            }
            // 只让自己特殊
            this.className = "box";
        }
    }
</script>

</body>

</html>

上一篇 下一篇

猜你喜欢

热点阅读