次のJavaScriptで複数のテキストメッセージを追加する方法

Question

5〜10個のテキストメッセージを1つずつ表示したい場合、各メッセージは虹色の効果を持つ同じdivに表示する必要があります。一度に1つのメッセージしか表示されません。

<!-- Add the below code 
where you wish the text to appear on the page: --> 

<b> 
<font size="5"> 
<script> 

// ********** MAKE YOUR CHANGES HERE 

var text="RAINBOW TEXT"  // YOUR TEXT 
var speed=80 // SPEED OF FADE -  

// ********** LEAVE THE NEXT BIT ALONE! 

// **** Do Not Alter Code Below **** 
if (document.all||document.getElementById){ 
    document.write('<span id="highlight">' + text + '</span>') 
    var storetext=document.getElementById?document.getElementById("highlight"):document.all.highlight 
} 
else 
    document.write(text) 

var hex=new  Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0") 
var r=1 
var g=1 
var b=1 
var seq=1 

function changetext(){ 
    rainbow="#"+hex[r]+hex[g]+hex[b] 
    storetext.style.color=rainbow 
} 

function change(){ 
    if (seq==6){ 
     b-- 

     if (b==0) 
      seq=1 
    } 

    if (seq==5){ 
     r++ 

     if (r==12) 
      seq=6 
    } 

    if (seq==4){ 
     g-- 

     if (g==0) 
      seq=5 
    } 

    if (seq==3){ 
     b++ 

     if (b==12) 
      seq=4 
    } 

    if (seq==2){ 
     r-- 

     if (r==0) 
      seq=3 
    } 

    if (seq==1){ 
     g++ 

     if (g==12) 
      seq=2 
    } 

    changetext() 
} 

function starteffect(){ 
    if (document.all||document.getElementById) 
     flash=setInterval("change()",speed) 
} 

starteffect() 
</script> 
</font> 
</b> 

Answer 1

あなたはおそらく、これらの線に沿って何かを試みることができる：あなたはあなたの言葉は、一度に1つのAを表示させたい場合は、所定の周波数で、あなたはあなたをできるようになる

setInterval(callback, timer) 

を使用して開始することができますX秒ごとに「出現関数」を呼び出す。

コールバック関数は、コンテナに単語を追加する関数です。あなたが好きなもののために行くことができます：

var list = ["hello", "my", "name", "is", "Robert"]; 
var current = 0; 
setInterval(function() { 
    myContainer.innerHTML += '<span class="word">' + list[current] +'</span>'; 
    current++; 
}, 1000); 

しないでください：あなたの言葉は、言葉の準備リストから来る場合は、このリストを歩くことができ

myContainer.innerHTML += '<span class="word">' + randomWord +'</span>'; 

、時間当たり1つのステップは、間隔が実行されます色の変更に関する機能を追加することを忘れないでください。新しいRGBコードを計算し、それをコンテナに追加する各<span>タグにスタイルとして追加することができます。もう1つの解決策として、あなたがしたように色のセットを強制するつもりがない場合は、blog articleと思うと、純粋なCSS +で虹の効果をどのように実装するかについて説明します。あなたのコンテナ。残念ながら、単語ごとに単一の色を常に持つことはできません。その後

、できるだけ早くあなたの配列の終わりに達してきたように間隔を停止してください：

var list = ["hello", "my", "name", "is", "Robert"]; 
var current = 0; 
var itv = setInterval(function() { 
    myContainer.innerHTML += '<span class="word">' + list[current] +'</span>'; 
    current++; 
    if (current >= list.length) { 
     clearInterval(itv); 
    } 
}, 1000); 

は、Web開発者のための非常に完全かつかなりクールであるthe Mozilla documentationを確認してください。）