html轮播效果圆点怎么实现,JavaScript实现轮播图圆点选中效果（排他思想）

运用场景

这个场景不必多说就是轮播图下边那个点点大家应该可以发现这个点点基本上就是我们鼠标放上去就会切换一个页面，所以这就是一个事件的效果，是什么事件呢？想一想应该是onmouseover，就是我们的鼠标经过我们的元素后产生一个事件，进行的一些操作

分析

当我们的鼠标放在一个小圆点上边的时候我们发现的事情就是那个圆点变色了。所以我们在程序里边应该如何去实现这个功能呢？我们选中了这个修改这个元素的Style以后再选中下一个时候前边选中的如何取消呢？这就是问题所在，这个问题的解决方式就是把我们修改过的元素重新修改回来，就是排他思想。

上代码

在这里呢我就先使用button来表示一下功能点后边具体运用到项目的时候在进行详细的写功能吧

按钮1

按钮2

按钮3

按钮4

按钮5

buts = document.getElementsByTagName('button')

for (var i = 0; i < buts.length; i++){

buts[i].onmouseover = function(){

for (var i = 0; i < buts.length; i++)

{

buts[i].style.backgroundColor = '';

}

this.style.backgroundColor = 'pink';

}

}