JavaScriptでの矢印付きテキストスライダー

それでは、矢印付きのテキストスライダーを作成しましょう。 これは、テキストがタイマーではなく、矢印をクリックすることで 切り替わることを意味します。HTMLコードに矢印を追加します：

html<a href="" id="left">←</a>
<a href="" id="right">→</a>
<div id="slider"></div>

このスライダーの実装の主な注意点は、 テキストのカウンター変数が両方の矢印の クリックハンドラーで共通でなければならないことです：

javascriptlet i = 0; // 外部変数

left.addEventListener('click', function() {
  // iを1減らす
  // そして番号iのテキストを表示する
});
right.addEventListener('click', function() {
  // iを1増やす
  // そして番号iのテキストを表示する
});

そして2つ目の注意点は、 iを減らす場合も増やす場合も、 0未満や配列の最後の要素を超える数値に してはいけないということです。