ボタンをクリックすると異なる機能が実行される

Question

私はJavaScriptを使用してWebページを作成しています。ボタンをクリックするたびにボタン内のテキストが次のテキストに変わるようにボタンを実装します。基本的に、私は一歩を行くためにswitch文とカウンタを使用

CodePen.io

var textCount = 0; 
function changeText() { 
    var myText = document.getElementById("demo"); 
    switch (textCount) { 
    case 0:{ 
     myText.innerHTML = "This is the second text"; 
     textCount++; 
    } 
    break; 
    case 1: { 
     myText.innerHTML = "This is the third text"; 
     textCount++; 
    } 
    break; 
    case 2: { 
     myText.innerHTML = "It keeps going on like this"; 
     textCount++; 
    } 
    break; 
    } 
} 

：

現在、私はこの（私が何を意味するか説明するためにもデモ）のようにそれをやっていますステップ。

私はこれを行うと考えることができます別の方法は、すべてのテキストを保持している配列を持つことであり、それは（より効率的と思われる）を介して、私の関数がちょうど行く

---

• しかし、私はまだ欲しいですあなたが純粋なJavascriptでこれを達成することができることは明らかですが、そこに他の方法があるかどうかを知るためです。

ありがとうございます。

Answer 1

あなたは正しい、あなたが例えば、配列を使用して、それが&クリーンより効率的に行うことができます：

let list = ['Message one', 'Message two', 'Message three', 'Message four']; 

let counter = 0; 

function clickHandler() { 
    element.textContent = list[counter]; 
    counter = (counter + 1) % list.length; // If you want to loop messages, otherwise ++ 
}