Response: text() メソッド

構文

text()

引数

なし。

返値

文字列で解決するプロミスです。

例外

DOMException AbortError

リクエストが中止された場合。

TypeError

以下のいずれかの原因で発生します。

• レスポンス本体が妨害またはロックされている場合。
• 本体コンテンツをデコードする際にエラーが発生した場合（例えば、Content-Encoding ヘッダーが不正な場合など）。

例

fetch text の例（fetch text をライブで実行）には、<article> 要素と 3 つのリンク（myLinks 配列に格納されています）があります。 最初に、リンクのすべてを反復処理し、それぞれのリンクに、その 1 つをクリックしたとき、 getData() 関数がリンクの data-page 識別子を引数として実行されるように、onclick イベントハンドラーを設定します。

getData() が実行されると、Request() コンストラクターを使用して新しいリクエストを作成し、それを使用して特定の .txt ファイルをフェッチします。 フェッチが成功したら、text() を使用してレスポンスから文字列を読み取り、<article> 要素の innerText にそのテキストオブジェクトの値を設定します。

const myArticle = document.querySelector("article");
const myLinks = document.querySelectorAll("ul a");

for (const link of myLinks) {
  link.onclick = (e) => {
    e.preventDefault();
    const linkData = e.target.getAttribute("data-page");
    getData(linkData);
  };
}

function getData(pageId) {
  console.log(pageId);
  const myRequest = new Request(`${pageId}.txt`);
  fetch(myRequest)
    .then((response) => response.text())
    .then((text) => {
      myArticle.innertext = text;
    });
}

仕様書

ブラウザーの互換性

関連情報

• サービスワーカー API
• HTTP アクセス制御 (CORS)
• HTTP