JS无限执行隔行变色

代码:

javascript 复制代码
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul>
        <li>随机变色</li>
        <li>随机变色</li>
        <li>随机变色</li>
        <li>随机变色</li>
        <li>随机变色</li>
        <li>随机变色</li>
        <li>随机变色</li>
        <li>随机变色</li>
        <li>随机变色</li>
        <li>随机变色</li>
    </ul>
    <script>
        let li = document.getElementsByTagName('li')[0]
        let ul = li.parentNode
        let ulson = ul.children
        let i=0
        function sj(){
            return Math.floor(Math.random()*256)
        }
        setInterval(o=>{
            ulson[i].style.backgroundColor=`rgb(${sj()},${sj()},${sj()})`
            i++
            if(i==ulson.length){
                i=0
            }
        },1000)     
        
    </script>
</body>
</html>

效果图:

相关推荐
冬夜戏雪11 分钟前
实习面经记录(十)
java·前端·javascript
skiy19 分钟前
java与mysql连接 使用mysql-connector-java连接msql
java·开发语言·mysql
一念春风20 分钟前
智能文字识别工具(AI)
开发语言·c#·wpf
桦01 小时前
【C++复习】:继承
开发语言·c++
何仙鸟1 小时前
GarmageSet下载和处理
java·开发语言
wefly20171 小时前
免安装!m3u8live.cn在线 M3U8 播放器,小白也能快速上手
java·开发语言·python·json·php·m3u8·m3u8在线转换
爱学习的程序媛1 小时前
【Web前端】JavaScript设计模式全解析
前端·javascript·设计模式·web
小码哥_常2 小时前
从SharedPreferences到DataStore:Android存储进化之路
前端
老黑2 小时前
开源工具 AIDA:给 AI 辅助开发加一个数据采集层,让 AI 从错误中自动学习(Glama 3A 认证)
前端·react.js·ai·nodejs·cursor·vibe coding·claude code
薛先生_0992 小时前
js学习语法第一天
开发语言·javascript·学习