DOM案例（轮播图、瀑布流、升级版瀑布流）

1.轮播图

<script>
    var dMove = document.getElementsByClassName('move')[0];
    var dPrev = document.getElementsByClassName('prev')[0];
    var dNext = document.getElementsByClassName('next')[0];
    var dots = document.getElementsByClassName('dot');
    var showIndex = 1;  //当前显示图片的下标
    var myWidth = -400;   //单位宽度
    var moveTimer = null;  //两个图片切换
    var timer = null;  //自动轮播
    var isScroll = false;  //轮播图是否在滚动中
    timer = setInterval(function() {
        toScroll(showIndex+1);
    },5000)

    // 思路分析
    // 路程 = 终点 - 起点
    // s = 目标图片的下标 * myWidth - showIndex * myWidth;

    dNext.onclick = function() {
        toScroll(showIndex+1);
    }
    dPrev.onclick = function() {
        toScroll(showIndex-1);
    }
    for (var i=0; i<dots.length; i++) {
        dots[i].index = i+1;
        dots[i].onclick = function() {
            to