【Javascript】DOM Samples /Core　Node/appendChild()

<script type="text/javascript">
<!--

//書き換える文字データ
var textData = new Array()

    textData[0] = "むかしむかしあるところに"
    textData[1] = "おじいさんとおばあさんが"
    textData[2] = "しんでいました。　　合掌"
    textData[3] = "------------------------"
    textData[4] = "ももたろさんももたろさん"
    textData[5] = "おこしにつけたきびだんご"
    textData[6] = "ひとつわたしに"
    textData[7] = "くさいなぁ"
    textData[8] = "------------------------"
    //↑この後ろに続けて連番でデータを増やすことができます。

//カウンター
var count = 0 

//文字の書き換え処理
function apendTextData(oj){

  removeText( oj , oj.lastChild )    //取り除き
  appendText( oj,textData[count++] ) //書き出し

  //文字データ数を超えたらリセット
  if( count > textData.length-1 ) count = 0 

}

// 文字列を追加する 
function appendText( oj , text )
{ 
  return oj.appendChild( document.createTextNode(text) )
}

// 文字列を削除する 
function removeText( oj , oldNode )
{ 
  return oj.removeChild( oldNode )
}

//-->
</script>

<form>
  <input type="button" value=" click! "
         onclick="if(document.getElementById)
                  apendTextData(document.getElementById('test'))">
</form>

<div id="test" 
     style="font-size:20px;font-weight:900;color:orange">
はじまりはじまり...
</div>