トップ・ページの表示 注意書きの表示 掲示板に書き込む前に必ず この ”注意書き”を お読み下さい.

"Twilight"

Index Menu
(1)<FirstTitle>:JavaFXデモ/Sceneの遷移 <FirstUser>:amanojaku@管理人 (1)<FirstTitle>:Javaデモ/うるう年 <FirstUser>:amanojaku@管理人

   
   

ページの表示順:{ 新しい順/ 古い順}.
初期・ページの表示・位置:{ 先頭ページ/ 末尾ページ}.
1ページ内のスレッド表示数:







<Number>: [000002BB]  <Date>: 2022/01/23 12:02:24
<Title>: JavaScriptデモ/AJAX「外部テキスト・ファイル読み込み」
<Name>: amanojaku@管理人



AJAXを使っているのでクライアント上では正常に動作しません。
動作を確認するには、サーバーかローカル・サーバーが必要です。


【HTMLファイル】

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <!--
metaタグでcharsetをUTF-8に設定しています。
(モチロン他のキャラクターセットに変更しても良いですが)必ずcharsetに設定されているキャラクターセットでセーブして下さい。
-->
<link rel="preload" href="sample.txt" as="script">
  <!--
preloadで先読みすれば、ロードの時間を短縮できる可能性がある。
-->
<title></title>
</head>
<body>
  <button type="button" onclick="AJAX_Display()">Click!</button><br>
  <div id="idDisplay"></div>

</body>
<script>
  function AJAX_Display() {
    let wDisplay = document.getElementById("idDisplay");
    let sFileName = "sample.txt"
    let sCharset = "UTF-8"; // 文字エンコード
    // 文字エンコードが間違っていると、全角文字が文字化けします。

    let oAJAX = new XMLHttpRequest();
    oAJAX.overrideMimeType('text/plain; charset=' + sCharset);
    oAJAX.open("GET", sFileName, true);
    oAJAX.onload = function () {
      console.log("oAJAX.onload");
      if (this.readyState === 4 && this.status === 200) {
        console.log("this.readyState: " + this.readyState);
        console.log("this.status: " + this.status);
        let res = oAJAX.responseText;
        wDisplay.innerHTML = res;
      }
    };
    oAJAX.send(null);
  }
</script>
</html>


【sample.txt】

<span style="background-color: #0f0;" >HELLO WORLD!</span><br>

Block( Address 000002BB Identity 000002BB )






ページの表示順:{ 新しい順/ 古い順}.
初期・ページの表示・位置:{ 先頭ページ/ 末尾ページ}.
1ページ内のスレッド表示数:

   
   

管理者用 Password:

  




SMT Version 8.022(+A) Release M6.
Author : amanojaku.