カルーセル効果を書くためのjs

<div id="ボックス">
    <ul>
      <li class="show"><img src="img/1.jpg" alt=""></li>
      <li><img src="img/2.jpg" alt=""></li>
      <li><img src="img/3.jpg" alt=""></li>
      <li><img src="img/4.jpg" alt=""></li>
      <li><img src="img/5.jpg" alt=""></li>
      <li><img src="img/6.jpg" alt=""></li>
    </ul>
    <img src="img/l.png" alt="" id="lef">
    <img src="img/r.png" alt="" id="rig">
    <オル>
      <li class="focus" data-i = "0"></li>
      <li データ-i = "1"></li>
      <li データ-i = "2"></li>
      <li データ-i = "3"></li>
      <li データ-i = "4"></li>
      <li データ-i = "5"></li>
    </ol>
</div>

 <スクリプト>
    var liList = document.querySelectorAll("#box ul li")
    var olList = document.querySelectorAll("#box ol li")
    var rig = document.getElementById("rig")
    var lef = document.getElementById("lef")

    変数インデックス = 0
    関数setLi(){
      for(var i = 0;i <liList.length;i++){
        liList[i].className = ""
        olList[i].className = ""
      }
      liList[インデックス].className = "表示"
      olList[インデックス].className = "フォーカス"
    }
    //Rightrig.onclick = function(){
      if(インデックス !== 5){
        インデックス++
      }
      if(インデックス === 5){
        インデックス = 0
    }
    setLi()
  }
  //左 lef.onclick = function(){
      
      if(インデックス !== 0){
        索引 - 
      }
      if(インデックス === 0){
        インデックス = 5
    }
    setLi()
  }
  //ポイント for(var i = 0;i < olList.length;i++){
    olList[i].onclick = 関数(){
      インデックス = this.getAttribute("data-i")
      setLi()
    }
  }
  // タイミング var autoPlay = setInterval(
    関数（）{
      リグ.クリック()
    },3000)

  //再生を停止するにはマウスを移動します var box = document.querySelector("div")
  box.onmouseenter = 関数(){
    clearInterval(自動再生)
  }

  // マウスを離して再生を続けます box.onmouseleave = function(){
    自動再生 = 間隔を設定する(
    関数（）{
      リグ.クリック()
    },3000)
  }
</スクリプト>