js怎么实现点击循环切换颜色

JavaScript012

js怎么实现点击循环切换颜色,第1张

你可以先将要出现的颜色,存储到一个数组里,点击时切换数组里的元素就可以了。

下面是小例子:

<body>

<div style="width:100px height:100px border:1px solid #ccc"></div>

</body>

<script>

var sColor = ['red','blue','yellow','gray']

var oDiv = document.getElementsByTagName('div')[0]

var iNum = 0

oDiv.onclick = function(){

this.style.background = sColor[iNum%sColor.length]

iNum++

}

</script>

1、首先我们来创建一个p元素,在里面写上hello:。

2、在浏览器界面上的显示如下。

3、接下来我们就为这个p元素来设置背景颜色。

4、接下来看看浏览器中变化。

5、说明我们就已经为p元素改好了背景色,如果要改变颜色的话直接在后面改就好。