使用for of 循环操作元素

最新推荐文章于 2022-07-14 16:59:12 发布

前端酱紫

最新推荐文章于 2022-07-14 16:59:12 发布

阅读量403

点赞数

分类专栏： # Javascript-demo

本文链接：https://blog.csdn.net/wuj1935/article/details/105369096

版权

Javascript-demo 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

使用for of 循环操作元素：

点击哪个li 哪个li 变成红色

    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
    
    <script>
        // 点击哪个li 哪个li 变成红色
        let lis = document.querySelectorAll('li');
        for (let val of lis) {
            val.addEventListener('click', function() {
                val.innerText = +val.innerText + 1
                val.style.backgroundColor = 'red'
            })
        };
    </script>

点击哪个li 哪个li 变成蓝色

    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
    <script>
        // 点击哪个li 哪个li 变成 蓝色
        let lis = document.querySelectorAll('li');
        for (let vals of lis) {
            vals.addEventListener('click', function() {
                vals.style.backgroundColor = 'blue'
            })
        };
    </script>