Ajax   2. テキストファイルを読む  
Ajax
Written 2/19/06
3. ページの内容を変える
このページはinnerHTMLを知っている人にとっては無用です。 飛ばしてください。
このページのスクリプトはIE4以上で動くと思います。
それ以外の場合はちょっと待ってください。
動的にページを変える
ページ内で何か操作して結果を出すとき、 次のページに遷移するとその分待ちが発生してしまいますし、 またスクロールしなければならないかもしれないなど 色々ユーザが使いにくくなってしまいます。
そのため、なるべく同じページを使い、 その中で変化させるほうがよいと思われます。
フォームのテキストを使う
従来はフォームのテキストを使ったりしていましたが、 あまりかっこよくなかったり、できることが限られていました。
ヤング度テスト
「〜茶」といえば、次のうちどちら?
加藤茶 みどり茶
innerHTMLを使う
IE4以上ではinnerHTMLを使うと、 ちょっと見栄えがよくなります。
ヤング度テスト
「〜茶」といえば、次のうちどちら?
加藤茶 みどり茶
まず、表示する場所に次のように書いておきます。
  <div id="div1"></div>
 
こうしておいて、スクリプトのほうで、
  div1.innerHTML = "「緑茶」を「みどりちゃ」と読むあなたは若いです。";
 
とすると、
  <div id="div1">「緑茶」を「みどりちゃ」と読むあなたは若いです。</div>
 
と書いたのと同じことになります。
innerHTMLにはテキストだけではなくタグも含められます。
ヤング度テスト
「〜茶」といえば、次のうちどちら?
加藤茶 みどり茶
  div2.innerHTML = "<span style='font-weight:bold;color:red'>\n"
        + " 「緑茶」を「みどりちゃ」と読むあなたは若いです。\n</span>";
 
とすると、
  <span style='font-weight:bold;color:red'>
   「緑茶」を「みどりちゃ」と読むあなたは若いです。
  </span>
 
と書いたのと同じことになります。
Ajax   2. テキストを読む