diff options
Diffstat (limited to 'files')
| -rw-r--r-- | files/ja/web/guide/ajax/index.html | 27 |
1 files changed, 12 insertions, 15 deletions
diff --git a/files/ja/web/guide/ajax/index.html b/files/ja/web/guide/ajax/index.html index 151377c1d0..14e8444503 100644 --- a/files/ja/web/guide/ajax/index.html +++ b/files/ja/web/guide/ajax/index.html @@ -4,23 +4,20 @@ slug: Web/Guide/AJAX tags: - AJAX - DOM + - JSON - JavaScript - References - - XML - XMLHttpRequest translation_of: Web/Guide/AJAX --- -<div class="callout-box"><strong><a href="/ja/docs/Web/Guide/AJAX/Getting_Started">はじめに</a></strong><br> -AJAX 入門</div> +<h2 id="Getting Started"><a href="/ja/docs/Web/Guide/AJAX/Getting_Started">はじめに</a></h2> -<div> <p><span class="seoSummary"><strong><u>A</u>synchronous <u>J</u>avaScript <u>a</u>nd <u>X</u>ML (AJAX)</strong> はそれ自体がある種の技術というわけではありませんが、 Jesse James Garrett によって 2005 年に作られた言葉で、既存の技術同士を組み合わせた新しいアプローチを意味します。</span>組み合わされる技術は、<a href="/ja/docs/Web/HTML">HTML</a>, <a href="/ja/docs/Glossary/XHTML">XHTML</a>, <a href="/ja/docs/Web/CSS">CSS</a>, <a href="/ja/docs/Web/JavaScript">JavaScript</a>, <a href="/ja/docs/Web/API/Document_Object_Model">DOM</a>, <a href="/ja/docs/Web/XML">XML</a>, <a href="/ja/docs/Web/XSLT">XSLT</a>, そして最も重要なものは {{domxref("XMLHttpRequest")}} オブジェクトです。<br> これらの技術が AJAX のモデルで組み合わされると、ウェブアプリケーションはより早く、表示されているページ全てを再読み込みすることなく、ユーザーインターフェイスを逐次更新できるようになります。そして、アプリケーションにより早い表示、より良い応答性をもたらします。</p> <p>Ajax の X は XML を表していますが、 {{glossary("JSON")}} の方がより軽く JavaScript の一部であることなど数多くの利点があるため、今日では XML よりもよく使われています。 JSON と XML はどちらも Ajax モデルの情報をパッケージ化するために使用されます。</p> -</div> -<h2 class="Documentation" id="Documentation" name="Documentation">ドキュメント</h2> +<h2 id="Documentation">ドキュメント</h2> <dl> <dt><a href="/ja/docs/Web/Guide/AJAX/Getting_Started">はじめに</a></dt> @@ -28,9 +25,9 @@ AJAX 入門</div> <dt><a href="/ja/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest"><code>XMLHttpRequest</code> API の使用</a></dt> <dd>{{domxref("XMLHttpRequest")}} API は、Ajax のコアです。この記事では、次のような Ajax 技術の使用方法について説明します。 <ul> - <li><a href="/ja/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Handling_responses">サーバーのレスポンスの分析と操作</a></li> - <li><a href="/ja/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Monitoring_progress">リクエストの進捗のモニタリング</a></li> - <li><a href="/ja/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files">フォームの送信とバイナリファイルのアップロード</a> – <em>純粋な</em> Ajax、もしくは {{domxref("FormData")}} オブジェクトを使用します</li> + <li><a href="/ja/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#handling_responses">サーバーのレスポンスの分析と操作</a></li> + <li><a href="/ja/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#monitoring_progress">リクエストの進捗のモニタリング</a></li> + <li><a href="/ja/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#submitting_forms_and_uploading_files">フォームの送信とバイナリファイルのアップロード</a> – <em>純粋な</em> Ajax、もしくは {{domxref("FormData")}} オブジェクトを使用します</li> <li><a href="/ja/docs/Web/API/Worker">ウェブワーカー</a>内部における Ajax の使用</li> </ul> </dd> @@ -39,7 +36,7 @@ AJAX 入門</div> <dt><a href="/ja/docs/Web/API/Server-sent_events">Server-sent イベント</a></dt> <dd>伝統的に、ウェブページは新しいデータを受信するためにサーバにリクエストを送信しなければなりません。つまり、ページはサーバにデータを要求します。サーバが送信したイベントでは、サーバがメッセージをウェブページにプッシュすることで、いつでもウェブページに新しいデータを送信することができます。これらの着信メッセージは、ウェブページ内の<em><a href="/ja/docs/Web/API/Event">イベント</a>+データ</em>として扱うことができます。<a href="/ja/docs/Web/API/Server-sent_events/Using_server-sent_events">サーバー送信イベントの使用</a>を参照してください。</dd> <dt><a href="/ja/docs/Web/API/History_API/Example"><em>純粋な Ajax</em> ナビゲーションサンプル</a></dt> - <dd>この記事では、純粋な Ajax ウェブサイトの3つのページから構成された実用的な (最小限の) 例を提供します。</dd> + <dd>この記事では、<em>純粋な Ajax</em> ウェブサイトの3つのページから構成された実用的な (最小限の) 例を提供します。</dd> <dt><a href="/ja/docs/Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data">バイナリデータの送信と受信</a></dt> <dd><code>XMLHttpRequest</code> オブジェクトの <code>responseType</code> プロパティを設定して、予想されるレスポンスタイプをサーバから変更することができます。可能な値は空文字列 (デフォルト), <code>arraybuffer</code>, <code>blob</code>, <code>document</code>, <code>json</code>, <code>text</code> です。<code>response</code> のプロパティには、 <code>responseType</code> に従って <code>ArrayBuffer</code>, <code>Blob</code>, <code>Document</code>, <code>JSON</code>、または string のようなエンティティ本文が含まれます。この記事では、Ajax の I/O 技術をいくつか紹介します。</dd> <dt><a href="/ja/docs/Web/XML">XML</a></dt> @@ -47,21 +44,21 @@ AJAX 入門</div> <dt><a href="/ja/docs/Web/Guide/Parsing_and_serializing_XML">XML の解釈とシリアライズ</a></dt> <dd>文字列、ファイル、または JavaScript を使用して XML 文書を解釈する方法、XML 文書を文字列、Javascript Object Tree (JXON) またはファイルにシリアル化する方法</dd> <dt><a href="/ja/docs/Web/XPath">XPath</a></dt> - <dd>XPath は <strong>X</strong>ML <strong>Path</strong> Language (XML パス言語) の略で、<a href="/ja/docs/XML">XML</a> 文書のさまざまな部分をアドレス指定する (指す) 柔軟な方法を提供する非 XML 構文を使用します。これと同様に、ドキュメント内のアドレス指定されたノードをテストしてパターンに一致するかどうかを判断することもできます。</dd> + <dd>XPath は <strong>X</strong>ML <strong>Path</strong> Language (XML パス言語) の略で、<a href="/ja/docs/Web/XML">XML</a> 文書のさまざまな部分をアドレス指定する (指す) 柔軟な方法を提供する非 XML 構文を使用します。これと同様に、ドキュメント内のアドレス指定されたノードをテストしてパターンに一致するかどうかを判断することもできます。</dd> <dt>{{domxref("FileReader")}} API</dt> <dd><code>FileReader</code> API を使用すると、ウェブアプリケーションがユーザーのコンピューターに格納されているファイル (または生データバッファ) の内容を非同期に読み取ることができ、読み取るファイルまたはデータを {{domxref("File")}} または {{domxref("Blob")}} オブジェクトで特定します。 File オブジェクトはユーザーが {{HTMLElement("input")}} 要素を使用して選択した結果として返される {{domxref("FileList")}} オブジェクト、ドラッグ＆ドロップ操作の {{domxref("DataTransfer")}} オブジェクト、 {{domxref("HTMLCanvasElement")}} の <code>mozGetAsFile()</code> API から取得することができます。</dd> - <dt><a href="/en-US/docs/Web/API/XMLHttpRequest/HTML_in_XMLHttpRequest">XMLHttpRequest における HTML</a></dt> - <dd>W3C の <a class="external" href="https://xhr.spec.whatwg.org/">XMLHttpRequest</a> 仕様書では、もともと XML の解析のみに対応していた {{domxref("XMLHttpRequest")}} に HTML 解析の対応が追加されています。この機能を使用すると、ウェブアプリケーションは <code>XMLHttpRequest</code> を使用して解析された DOM として HTML リソースを取得できます。</dd> + <dt><a href="/ja/docs/Web/API/XMLHttpRequest/HTML_in_XMLHttpRequest">XMLHttpRequest における HTML</a></dt> + <dd>W3C の <a href="https://xhr.spec.whatwg.org/">XMLHttpRequest</a> 仕様書では、もともと XML の解析のみに対応していた {{domxref("XMLHttpRequest")}} に HTML 解析の対応が追加されています。この機能を使用すると、ウェブアプリケーションは <code>XMLHttpRequest</code> を使用して解析された DOM として HTML リソースを取得できます。</dd> </dl> -<h2 id="Tools" name="Tools">ツール</h2> +<h2 id="Tools">ツール</h2> <dl> <dt><a href="https://github.com/axios/axios">axios</a></dt> <dd>{{jsxref("Promise")}} ベースの {{glossary("HTTP")}} クライアントで、内部的に <code>XMLHttpRequest</code> を使用しています。</dd> </dl> -<h2 class="Other" id="See_also" name="See_also">関連情報</h2> +<h2 id="See_also">関連情報</h2> <dl> <dt><a href="https://pdfs.semanticscholar.org/c440/ae765ff19ddd3deda24a92ac39cef9570f1e.pdf">Ajax: ウェブアプリケーションへの新しいアプローチ</a></dt> |