輪播圖作為前端比較簡易的動畫，使用非常頻繁，這裡記錄以便使用

此輪播圖為最簡易自動播放，非無縫，無按鈕，無縮圖和序號

想看全套輪播圖可以檢視我的分類輪播圖全套

html 佈局

<div style="width: 100%;">

        <div class="tu">
            <img src="02xsxx.jpg" alt="">
        </div>
        <div class="tu">
            <img src="20181011qlqnlt.jpg"
 
 alt="">
        </div>
        <div class="tu">
            <img src="20181011rcqx.jpg" alt="">
        </div>
        <div class="tu">
            <img src="20181016qdxq.jpg" alt="">
        </div>
        <div class="tu">
            <img src="20181018-sdlt0.jpg"
 
 alt="">
        </div>
        <div class="tu">
            <img src="20181022fanzeng.jpg" alt="">
        </div>

    </div>

.tu{
        float: left;
        width: 100%;
        display: none;
    }
.tu img{
        width: 100%;
    }

佈局並不重要下面說js

var jishu=0;    //計數用來記錄 該第幾張圖片顯示  
 

    var tu;            //接收.tu的dom物件變數
//    主體函式
    function aaa(){
// 獲取 dom
        tu =document.getElementsByClassName("tu"); 
        
        //顯示當前隱藏其他

//    我們這裡做了6張圖片  所以length為6.  如果此處a<=tu.length 那麼 length需要-1，因為操縱a從0到5剛好是6次
        for(var a = 0;a < tu.length; a++){
// 顯示jishu的張數，所以讓a與jishu對比
            if(a==jishu){
                tu[jishu].style.display="block";
// 否則除了與jishu相同的下標，其它的全部隱藏
            }else{
                tu[a].style.display="none";
            }
        }
        //到最後一張回到第一張，-2的原因：因為jishu和下標a是從0開始的，第六張就是下標5。
        if(jishu > tu.length-2){
            jishu=0;
　　　　// 否則不是最後一張，繼續jishu+1，然後去上面與a做判斷
        }else{
            jishu++;
        }
        
        
    }
　　// 呼叫第一次函式
    aaa();
// 兩秒呼叫一次aaa函式
    var dong = setInterval("aaa()",2000);