反復ループを通過すると、アレイ

Question

から文字列を返しますが、それはこの配列を反復処理し、1で配列1からHTMLの引用に戻すことは可能ですか？

これは私が把握することはできませんコードの私の作品です：

var quotes = ['"Time you enjoy wasting is not wasted time."', 
'"You can have it all. Just not all at once."', 
'"They say I am old-fashioned, and live in the past, but sometimes I think 
progress progresses too fast!"']; 

document.getElementById("btn1").addEventListener("click", newQuote); 
function newQuote(){ 
    for (var i = 0; i < quotes.length; i++) { 
    document.getElementById("quote").innerHTML = quotes[i]; 
    } 
} 

Answer 1

var quotes = ['"Time you enjoy wasting is not wasted time."', 
'"You can have it all. Just not all at once."', 
'"They say I am old-fashioned, and live in the past, but sometimes I think 
progress progresses too fast!"']; 

var quoteNumber = 0; 
document.getElementById("btn1").addEventListener("click", newQuote); 
function newQuote(){ 
    document.getElementById("quote").innerHTML = quotes[quoteNumber]; 
    quoteNumber++; 
    if(quoteNumber == quotes.length) quoteNumber = 0; 
} 

Answer 2

を次の引用のインデックスを追跡し、あなたが到達したら、それを周りにラップするカウンタを使用最後の1：

var nextQuote = 0; 
 

 
var quotes = [ 
 
    '"Time you enjoy wasting is not wasted time."', 
 
    '"You can have it all. Just not all at once."', 
 
    '"They say I am old-fashioned, and live in the past, but sometimes I think progress progresses too fast!"' 
 
]; 
 

 
function newQuote() { 
 
    document.getElementById("quote").innerHTML = quotes[nextQuote]; 
 
    nextQuote = (nextQuote + 1) % quotes.length; 
 

 
}

<div id='quote'></div> 
 
<button onClick='newQuote()'>Next Quote</button>