颜色切换的问题咨询

lyw2073327 2021-04-01 06:24:14

代码如下，本意是希望每按一下按钮改变一下<h1>的颜色，但发现跑不起来，麻烦各位帮忙看下，另外想咨询一下如果希望按钮可以一直按下去（即for循环中颜色到了最后一个后，继续点击按钮又会从第一个颜色开始切换）还需要怎么改这个代码呢，谢谢

<body>
<h1 id="id1">我的标题</h1>
<button type="button" onclick="text()">单击我！</button>

<script>
var colors = ['red','blue','yellow']; //这里只放了3个颜色，假设实际colors中有上千个颜色

var len = colors.length;
function text() {
for (var i = 0, i < len; i++) {
document.getElementById('id1').style.color = colors[i];
}
}
</script>

</body>

...全文

481 11 打赏收藏转发到动态举报

写回复

用AI写文章

11 条回复

切换为时间正序

请发表友善的回复…

发表回复

mnxm 2021-04-09

打赏
举报


var colors = ['red','blue','yellow']; 
var idx = 0;
function text() {
  document.getElementById('id1').style.color = colors[idx%colors.length];
  idx++;
}

lyw2073327 2021-04-09

打赏
举报

多谢了，很简洁且易懂 @mnxm

面向百度编程cv 2021-04-06

打赏
举报

if(arr >= colors.length){ arr = 0 }

面向百度编程cv 2021-04-02

打赏
举报

<button type="button" onclick="text()">单击我！</button> let arr = 0 let colors = ['red','blue','yellow']; function text() { arr ++ document.getElementById('id1').style.color = colors[arr]; }

lyw2073327 2021-04-02

打赏
举报

改成 colors[arr%(colors .lenght)] 跑不起来

風灬雲 2021-04-02

打赏
举报

引用 6 楼 lyw2073327 的回复:

[quote=引用 5 楼 qq_45713941 的回复:]<button type="button" onclick="text()">单击我！</button> let arr = 0 let colors = ['red','blue','yellow']; function text() { document.getElementById('id1').style.color = colors[arr]; arr ++ } 你好，请问如果点击到最后一个yellow之后，继续点击会继续从red开始重复的话要怎么修改呢

colors[arr] 改成 colors[arr%(colors .lenght)]

lyw2073327 2021-04-02

打赏
举报

[quote=引用 5 楼 qq_45713941 的回复:]<button type="button" onclick="text()">单击我！</button> let arr = 0 let colors = ['red','blue','yellow']; function text() { document.getElementById('id1').style.color = colors[arr]; arr ++ } 你好，请问如果点击到最后一个yellow之后，继续点击会继续从red开始重复的话要怎么修改呢