master

分支 (1)

管理

管理

master

six-walnuts
/
六个核桃.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0,maximum-scale=1,minimum-scale=1,user-scalable=no">
    <title>六个核桃.html</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        div {
            margin: 0 auto;
            width: 200px;
            line-height: 100px;
            font-size: 30px;
            text-align: center;
        }

        .qiu {
            background-color: yellow;
        }

        .zhang {
            background-color: skyblue;
        }

        .xiamei {
            background-color: rgb( 0, 0, 0);
        }
    </style>
</head>

<body>
    <div class="xiamei">邱夏梅</div>
    <div class="cunlong">张春龙</div>
    <div class="mingqiao">王明乔</div>
    <div class="mengxue">史梦雪</div>
    <div class="mengting">李梦婷</div>
    <div class="xiaoyan">蒋小燕</div>
    <script>
        class Call {
            constructor() {
                this.doms = [...document.querySelectorAll( 'div')];
                this.nameListener();
                this.color();
            }
            mad() {
                const arr = [];
                for( let i = 0; i < 3; ++i) {
                    arr.push( Math.floor( Math.random() * 256));
                }
                return arr;
            }
            color() {
                setInterval( () => {
                    this.doms.forEach( (item,index) => {
                        item.style.backgroundColor = `rbg( 3 ,3 ,3)`
                        item.style.backgroundColor = `rgb(${'' + this.mad()})`
                        console.log( item.style.backgroundColor)
                    })
                }, 100)
            }
            nameListener() {
                this.doms.forEach( item => {
                    item.addEventListener( 'click', () => {
                        alert( item.innerText)
                    })
                })
            }
        }
        const all = new Call();

        // const box = document.querySelector('.box')
        // box.addEventListener('click', function () {
        //     alert('邱夏梅')
        // })

        // const zhang = document.querySelector('.zhang')
        // zhang.addEventListener('click',() => {
        //     alert('张春龙')
        // })

        // const first = document.querySelector('.shi')
        // first.addEventListener('click', function () {
        //     alert("生活大爆炸")
        // })

        // const div = document.querySelector('.li');
        // div.addEventListener(('click'), function () {
        //     alert('水果出版社（李木子同学‍）')
        // })

        // const button = document.querySelector('button')
        // button.addEventListener('click', function () {
        //     alert('晴天')

        // })
    </script>
</body>

</html>