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

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

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

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

let i = 0; // 外部変数

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

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

説明されたスライダーを実装してください。テキストが循環するようにしてください。

前の課題を修正し、テキストが循環せず、最も右または左の位置に達したらそれ以上スクロールしないようにしてください。