--- title: Body.text() slug: Web/API/Body/text tags: - API - BODY - Experimental - Fetch - Method - Reference - Text translation_of: Web/API/Body/text ---
{{APIRef("Fetch")}}

{{domxref("Body")}} ミックスインの text() メソッドは、{{domxref("Response")}} ストリームを取得し、完全に読み込みます。 {{domxref("USVString")}} オブジェクト（テキスト）で解決する promise を返します。 レスポンスは常に UTF-8 としてデコードします。

構文

response.text().then(function (text) {
  // text レスポンスを使用して何か実行する。
});

パラメーター

なし。

戻り値

{{domxref("USVString")}} で解決する promise。

例

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

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

var myArticle = document.querySelector('article');
var myLinks = document.querySelectorAll('ul a');

for(i = 0; i <= myLinks.length-1; i++) {
  myLinks[i].onclick = function(e) {
    e.preventDefault();
    var linkData = e.target.getAttribute('data-page');
    getData(linkData);
  }
};

function getData(pageId) {
  console.log(pageId);
  var myRequest = new Request(pageId + '.txt');
  fetch(myRequest).then(function(response) {
    return response.text().then(function(text) {
      myArticle.innerHTML = text;
    });
  });
}

仕様

仕様 状態 コメント
{{SpecName('Fetch','#dom-body-text','text()')}} {{Spec2('Fetch')}}

ブラウザーの互換性

{{Compat("api.Body.text")}}

関連情報