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>

效果图:

相关推荐
wsdswzj6 分钟前
web与web服务器基础安全
服务器·前端·安全
额呃呃6 分钟前
Andriod项目番茄钟
java·开发语言
JarvanMo6 分钟前
Flutist - Flutter 模块化架构管理框架
前端
Via_Neo6 分钟前
不能对方法返回值进行赋值
开发语言·python
GISer_Jing9 分钟前
AI Agent Skills 发现指南:前端工程化与自动化全景
前端·人工智能·自动化
心.c9 分钟前
从 Function Call 到渐进式 Skill:大模型能力扩展范式的演进与落地实践
前端·人工智能·react.js·ai·react
IT_陈寒10 分钟前
Vue的响应式更新把我坑惨了,原来问题出在这里
前端·人工智能·后端
梅孔立12 分钟前
Java 基于 POI 模板 Excel 导出工具类 双数据源 + 自动合并单元格 + 自适应行高 完整实战
java·开发语言·excel
代码中介商13 分钟前
C++ 继承与派生深度解析:存储布局、构造析构与高级特性
开发语言·c++·继承·派生
Cobyte14 分钟前
6.响应式系统比对:通过 Vue3 响应式库写 React 应用
前端·javascript·vue.js