Response.text()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2017.

text() は Response インターフェイスのメソッドで、 Response ストリームを取得して完全に読み込みます。 String で解決するプロミスを返します。 レスポンスは常に UTF-8 としてデコードされます。

構文

js
text()

引数

なし。

返値

String で解決するプロミスです。

例

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

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

js
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.innerHTML = text;
    });
}

仕様書

Specification
Fetch Standard
# ref-for-dom-body-text①

ブラウザーの互換性

BCD tables only load in the browser

関連情報