From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/api/body/text/index.html | 88 +++++++++++++++++++++++++++++++++++ 1 file changed, 88 insertions(+) create mode 100644 files/ja/web/api/body/text/index.html (limited to 'files/ja/web/api/body/text') diff --git a/files/ja/web/api/body/text/index.html b/files/ja/web/api/body/text/index.html new file mode 100644 index 0000000000..d39fb14d9c --- /dev/null +++ b/files/ja/web/api/body/text/index.html @@ -0,0 +1,88 @@ +--- +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")}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf