バリケンのJavaScript日記 RSSフィード

2006-11-11

[] HTTPデータを取得  HTTPでデータを取得 - バリケンのJavaScript日記 を含むブックマーク はてなブックマーク -  HTTPでデータを取得 - バリケンのJavaScript日記  HTTPでデータを取得 - バリケンのJavaScript日記 のブックマークコメント

今日は「HTTPデータを取得」をやってみるよ。

昨日の「スライドショー」の応用で、「日記サイト」を作ってみるよ。今回は作る過程の説明は省略するよ。ポイントAjax.Requestによる「HTTPデータを取得」の部分だよ。

<html>
  <head>
    <script language="JavaScript" type="text/javascript" src="prototype.js">
    </script>
    <script type="text/javascript">
      function makeChangeText(files) {
        var i = 0;
        function f (x) {
          i = (i + x) % files.length;
          if (i < 0) i += files.length;
          return files[i];
        }
        return f;
      }
      var textFile = makeChangeText(["20061110.txt", "20061109.txt", "20061108.txt", "20061107.txt"]);
      function changeText(x) {
        new Ajax.Request(textFile(x), {
          method: "get",
          onComplete: function(request) {
            $("message").innerHTML = request.responseText;
          }
        })
      }
    </script>
  </head>
  <body onload="changeText(0)">
    <button onclick="changeText(1)">前の日</button>
    <button onclick="changeText(-1)">次の日</button>
    <div id="message"></div>
    <button onclick="changeText(1)">前の日</button>
    <button onclick="changeText(-1)">次の日</button>
  </body>
</html>

また今回も無料レンタルWebスペースにhtmlファイルを置いてみたよ。

http://muscovyduck.kusakage.com/javascript/diary/

「前の日」「次の日」をクリックすると日記の表示が変わるのを試してみてね。

トラックバック - http://javascript.g.hatena.ne.jp/muscovyduck/20061111