javascript轮播特效-Python学习网

javascript轮播特效

宋雪维

2021-01-14 16:15:191460浏览 · 0收藏 · 0评论

我们在地铁口、商场大屏幕看到按照一定时间简单循环播放的广告和新闻，他们这种播放方式属于轮播。在JavaScript开发学习的过程中难免会枯燥些，本文小编向大家介绍JavaScript趣味学法，使用JavaScript定时器进行轮播特效操作。

1、轮播特效使用原理：使用定时器设置一定时间切换一张图片

定时器setInterval() 方法

可按照指定的周期（以毫秒计）来调用函数或计算表达式。

使用语法

setInterval(code,millisec[,"lang"])

参数

code（必需）：要调用的函数或要执行的代码串。

millisec（必需）：周期性执行或调用 code 之间的时间间隔，以毫秒计。

2、JavaScript实现自动轮播特效：

使用定时器setInterval() 方法设置2秒切换一张图片

<body>
<img src="cankao/0.jpg" width="600"/>
</body>
<script>
    var i=0;
    setInterval(function() {
        i++;
        if(i==6){
            i=0;
        }
        var a=document.querySelector("img");
        a.src="cankao/"+i+".jpg"
    },2000)
 
</script>

以上就是javascript轮播特效实现的简单原理及代码，本文展示的是轮播效果最简单也是最基础的，大家可以放心尝试哦~更多js学习推荐：js教程。