Learn 以下の文書内のリンクURLを正規化 (#2356)

- /en-US へのリンクを /ja へのリンクに修正
- /ja が付いていないものに /ja を付加
- MDN内のリンクが完全URLの場合、 /ja/docs からのURLに修正

6 files changed, 47 insertions, 47 deletions

diff --git a/files/ja/learn/javascript/client-side_web_apis/fetching_data/index.html b/files/ja/learn/javascript/client-side_web_apis/fetching_data/index.html
index 44f7c8b035..7a47966ea1 100644
--- a/files/ja/learn/javascript/client-side_web_apis/fetching_data/index.html
+++ b/files/ja/learn/javascript/client-side_web_apis/fetching_data/index.html
@@ -48,9 +48,9 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Fetching_data
 
 <h3 id="Ajax_の登場">Ajax の登場</h3>
 
-<p>上述の問題を解決すべく、Web ページから細かいデータ (<a href="/docs/Web/HTML">HTML</a>、{{glossary("XML")}}、<a href="/docs/Learn/JavaScript/Objects/JSON">JSON</a> やプレーンテキストのような) をリクエストし、それを必要な時だけ表示するという技術の誕生へと繋がりました。</p>
+<p>上述の問題を解決すべく、Web ページから細かいデータ (<a href="/ja/docs/Web/HTML">HTML</a>、{{glossary("XML")}}、<a href="/ja/docs/Learn/JavaScript/Objects/JSON">JSON</a> やプレーンテキストのような) をリクエストし、それを必要な時だけ表示するという技術の誕生へと繋がりました。</p>
 
-<p>これは {{domxref("XMLHttpRequest")}} や、最近では <a href="/docs/Web/API/Fetch_API">Fetch API</a> の利用によって実現されます。これらの技術は、Web ページがサーバにある特定のリソースを直接 <a href="/docs/Web/HTTP">HTTP</a> リクエストし、必要があれば結果のデータを表示する前に整形する事を可能にしました。</p>
+<p>これは {{domxref("XMLHttpRequest")}} や、最近では <a href="/ja/docs/Web/API/Fetch_API">Fetch API</a> の利用によって実現されます。これらの技術は、Web ページがサーバにある特定のリソースを直接 <a href="/ja/docs/Web/HTTP">HTTP</a> リクエストし、必要があれば結果のデータを表示する前に整形する事を可能にしました。</p>
 
 <div class="note">
 <p><strong>注記</strong>: これらのテクニック一般はかつて Ajax (Asynchronous JavaScript and XML)と呼ばれていましたが、これは {{domxref("XMLHttpRequest")}} を使って XML データを要求するものが多かったためです。今日ではそういうものばかりではありませんが (<code>XMLHttpRequest</code> や Fetch を使って JSON を要求する場合の方が多いでしょう)、結果としては同じであり、"Ajax" という用語はしばしば今でもこのテクニックを説明するのに使われます。</p>
@@ -78,7 +78,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Fetching_data
 
 <h2 id="基本的な_Ajax_リクエスト">基本的な Ajax リクエスト</h2>
 
-<p>{{domxref("XMLHttpRequest")}} と <a href="/docs/Web/API/Fetch_API">Fetch</a> それぞれを使って、そのようなリクエストをどうやるのか見ていきましょう。それらの例では、いくつかの異なるテキストファイルから取り出したデータをリクエストし、コンテンツ領域に埋め込みます。</p>
+<p>{{domxref("XMLHttpRequest")}} と <a href="/ja/docs/Web/API/Fetch_API">Fetch</a> それぞれを使って、そのようなリクエストをどうやるのか見ていきましょう。それらの例では、いくつかの異なるテキストファイルから取り出したデータをリクエストし、コンテンツ領域に埋め込みます。</p>
 
 <p>この一連のファイルは疑似データベースとして働きます。実際のアプリケーションでは、PHP や Python、Node のようなサーバサイド言語を使ってデータベースから取り出したデータをリクエストする場合が多いでしょう。ですがここでは簡単にしておき、クライアント側のパートに集中します。</p>
 
@@ -156,9 +156,9 @@ verseChoose.value = 'Verse 1';</pre>
 
 <h3 id="サーバからあなたの例題を送らせる">サーバからあなたの例題を送らせる</h3>
 
-<p>今時のブラウザ (Chrome も含まれます) は、ローカルファイルとして例題を実行しても XHR リクエストを行ないません。これはセキュリティの制限によるものです (Web のセキュリティにより詳しくは <a href="/docs/Learn/Server-side/First_steps/Website_security">Webサイトのセキュリティ</a>を読んで下さい)。</p>
+<p>今時のブラウザ (Chrome も含まれます) は、ローカルファイルとして例題を実行しても XHR リクエストを行ないません。これはセキュリティの制限によるものです (Web のセキュリティにより詳しくは <a href="/ja/docs/Learn/Server-side/First_steps/Website_security">Webサイトのセキュリティ</a>を読んで下さい)。</p>
 
-<p>これをどうにかするため、例題をローカルの Web サーバを使って実行しなければなりません。どうやるのかは、 <a href="/docs/Learn/Common_questions/set_up_a_local_testing_server">テスト用のローカルサーバを設定するにはどうすればいい?</a> を読んで下さい。</p>
+<p>これをどうにかするため、例題をローカルの Web サーバを使って実行しなければなりません。どうやるのかは、 <a href="/ja/docs/Learn/Common_questions/set_up_a_local_testing_server">テスト用のローカルサーバを設定するにはどうすればいい?</a> を読んで下さい。</p>
 
 <h3 id="Fetch">Fetch</h3>
 
@@ -251,7 +251,7 @@ myFetch.then(function(response) {
   });
 }</pre>
 
-<p>レスポンスオブジェクトには {{domxref("Body.text","text()")}} メソッドがあって、これはレスポンスボディにある生データを受けて、プレインテキスト(これが私たちの必要とする形式です)、に変換します。このメソッドもプロミス(これは結果となるテキスト文字列で解決します)を返すので、ここでまた別の {{jsxref("Promise.then",".then()")}} を使い、この内部で、テキスト文字列を使って私たちがやりたい事を行うための別の関数を定義します。私たちがやるのは、ただ詩用の {{htmlelement("pre")}} 要素の <code><a href="/docs/Web/API/Node/textContent">textContent</a></code> プロパティをテキスト文字列と同じに設定だけなので、これはとても単純です。</p>
+<p>レスポンスオブジェクトには {{domxref("Body.text","text()")}} メソッドがあって、これはレスポンスボディにある生データを受けて、プレインテキスト(これが私たちの必要とする形式です)、に変換します。このメソッドもプロミス(これは結果となるテキスト文字列で解決します)を返すので、ここでまた別の {{jsxref("Promise.then",".then()")}} を使い、この内部で、テキスト文字列を使って私たちがやりたい事を行うための別の関数を定義します。私たちがやるのは、ただ詩用の {{htmlelement("pre")}} 要素の <code><a href="/ja/docs/Web/API/Node/textContent">textContent</a></code> プロパティをテキスト文字列と同じに設定だけなので、これはとても単純です。</p>
 
 <p>これも覚えておく価値があります、それぞれのブロックの結果を次のブロックに渡していくように、直接複数のプロミスブロック(<code>.then()</code>ブロック以外の種類もあります)を次から次へと連鎖する事ができます、あたかも鎖を下にたどっていくように。このおかげで、プロミスはとても強力なのです。</p>
 
@@ -263,7 +263,7 @@ myFetch.then(function(response) {
   poemDisplay.textContent = text;
 });</pre>
 
-<p>多くの開発者はこの書き方の方が好きです、なぜなら平らで、間違いなく長大なプロミス連鎖も読みやすいからです — それぞれのプロミスが、前のやつの内側に来る(これは扱いづらくなる場合があります)のではなく、前のやつから順々に続いています。違うのは <code><a href="/docs/Learn/JavaScript/Building_blocks/Return_values">return</a></code> 文を response.text() の前に書いて、それが出した結果を次の鎖に渡すようにしなければならないところだけです。</p>
+<p>多くの開発者はこの書き方の方が好きです、なぜなら平らで、間違いなく長大なプロミス連鎖も読みやすいからです — それぞれのプロミスが、前のやつの内側に来る(これは扱いづらくなる場合があります)のではなく、前のやつから順々に続いています。違うのは <code><a href="/ja/docs/Learn/JavaScript/Building_blocks/Return_values">return</a></code> 文を response.text() の前に書いて、それが出した結果を次の鎖に渡すようにしなければならないところだけです。</p>
 
 <h3 id="どっちの機構を使うべき">どっちの機構を使うべき?</h3>
 
diff --git a/files/ja/learn/javascript/client-side_web_apis/index.html b/files/ja/learn/javascript/client-side_web_apis/index.html
index 0675ea4da0..2335c02956 100644
--- a/files/ja/learn/javascript/client-side_web_apis/index.html
+++ b/files/ja/learn/javascript/client-side_web_apis/index.html
@@ -23,9 +23,9 @@ translation_of: Learn/JavaScript/Client-side_web_APIs
 
 <h2 id="前提条件">前提条件</h2>
 
-<p>このモジュールをよく理解するためには、ここまでの一連のJavaScriptに関するモジュール (<a href="/en-US/docs/Learn/JavaScript/First_steps">First steps</a>, <a href="/en-US/docs/Learn/JavaScript/Building_blocks">Building blocks</a> と <a href="/en-US/docs/Learn/JavaScript/Objects">JavaScript objects</a>) の学習をすませているべきです。これらのモジュールでは大抵簡単な API を使っていますが、その助けなしにクライアント側の JavaScript を書き上げるのは難しいからです。このチュートリアルの中では、JavaScript 言語のコア部分については十分理解しているものとして、よく使われる Web API についてもう少し詳しく探っていきます。</p>
+<p>このモジュールをよく理解するためには、ここまでの一連のJavaScriptに関するモジュール (<a href="/ja/docs/Learn/JavaScript/First_steps">First steps</a>, <a href="/ja/docs/Learn/JavaScript/Building_blocks">Building blocks</a> と <a href="/ja/docs/Learn/JavaScript/Objects">JavaScript objects</a>) の学習をすませているべきです。これらのモジュールでは大抵簡単な API を使っていますが、その助けなしにクライアント側の JavaScript を書き上げるのは難しいからです。このチュートリアルの中では、JavaScript 言語のコア部分については十分理解しているものとして、よく使われる Web API についてもう少し詳しく探っていきます。</p>
 
-<p><a href="/en-US/docs/Learn/HTML">HTML</a> と <a href="/en-US/docs/Learn/CSS">CSS</a> に関する基礎知識も役に立つでしょう。</p>
+<p><a href="/ja/docs/Learn/HTML">HTML</a> と <a href="/ja/docs/Learn/CSS">CSS</a> に関する基礎知識も役に立つでしょう。</p>
 
 <div class="note">
 <p><strong>注記</strong>: もし自分のファイルを作成できないようなデバイス上で作業しているなら、大半のコード例を <a href="http://jsbin.com/">JSBin</a> や  <a href="https://thimble.mozilla.org/">Thimble</a> のようなオンラインプログラム作成・実行環境で試してみることもできます。</p>
@@ -43,7 +43,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs
  <dt><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Third_party_APIs">サードパーティ API</a></dt>
  <dd>これまでに説明したAPIはブラウザに組込まれていますが、全てのAPIが組込まれているのではありません。グーグルマップやTwitter、Facebook、ペイパルなど、多くの巨大なWebサイトやサービスが、開発者に対して彼らのデータを利用したり(例:あなたのブログにtwitterのタイムラインを表示させる)、サービスを利用したり(例:あなたのサイトに独自のグーグルマップを表示したり、あなたのサービス利用者にFacebookでログインできたり)するためのAPIを提供しています。この記事ではブラウザAPIとサードパーティAPIの違いを見ていき、典型的な後者の使い方をお見せします。</dd>
  <dt><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Drawing_graphics">絵を描く</a></dt>
- <dd>ブラウザにはグラフィックを描くためのとても強力なツールがいくつか組込まれています。<a href="/docs/Web/SVG">SVG</a>(Scalable Vector Graphics)言語から、HTMLの{{htmlelement("canvas")}}キャンバス要素に描画するためのAPIまで (<a href="/docs/Web/API/Canvas_API">キャンバスAPI</a> や <a href="/docs/Web/API/WebGL_API">WebGL</a>を参照)。 この記事ではキャンバスAPIへの導入を説明し、もっと深く学習していくためのリソースをご紹介します。</dd>
+ <dd>ブラウザにはグラフィックを描くためのとても強力なツールがいくつか組込まれています。<a href="/ja/docs/Web/SVG">SVG</a>(Scalable Vector Graphics)言語から、HTMLの{{htmlelement("canvas")}}キャンバス要素に描画するためのAPIまで (<a href="/ja/docs/Web/API/Canvas_API">キャンバスAPI</a> や <a href="/ja/docs/Web/API/WebGL_API">WebGL</a>を参照)。 この記事ではキャンバスAPIへの導入を説明し、もっと深く学習していくためのリソースをご紹介します。</dd>
  <dt><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs">動画と音声の API</a></dt>
  <dd>HTML5には文書にリッチなメディアを埋め込むための要素が備わっています — {{htmlelement("video")}} と {{htmlelement("audio")}} — それぞれに再生やシークなどの操作するための独自APIを備えています。この記事では独自の再生操作パネルを作成するような、よくある仕事をどうやればいいのかお見せします。</dd>
  <dt><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage">クライアント側でのデータ保存</a></dt>
diff --git a/files/ja/learn/javascript/client-side_web_apis/introduction/index.html b/files/ja/learn/javascript/client-side_web_apis/introduction/index.html
index f685066a4d..51db397a58 100644
--- a/files/ja/learn/javascript/client-side_web_apis/introduction/index.html
+++ b/files/ja/learn/javascript/client-side_web_apis/introduction/index.html
@@ -24,7 +24,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Introduction
  <tbody>
   <tr>
    <th scope="row">前提条件:</th>
-   <td>基本的なコンピューターの知識および利用能力、<a href="/en-US/docs/Learn/HTML">HTML</a> と <a href="/en-US/docs/Learn/CSS">CSS</a> の基本的な理解、JavaScript の基本 (<a href="/ja/docs/Learn/JavaScript/First_steps">第一歩</a>、<a href="/ja/docs/Learn/JavaScript/Building_blocks">構成要素</a>, <a href="/ja/docs/Learn/JavaScript/Objects">JavaScriptオブジェクト</a>).</td>
+   <td>基本的なコンピューターの知識および利用能力、<a href="/ja/docs/Learn/HTML">HTML</a> と <a href="/ja/docs/Learn/CSS">CSS</a> の基本的な理解、JavaScript の基本 (<a href="/ja/docs/Learn/JavaScript/First_steps">第一歩</a>、<a href="/ja/docs/Learn/JavaScript/Building_blocks">構成要素</a>, <a href="/ja/docs/Learn/JavaScript/Objects">JavaScriptオブジェクト</a>).</td>
   </tr>
   <tr>
    <th scope="row">目的:</th>
@@ -54,7 +54,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Introduction
 <p>クライアントサイド API では、実際非常にたくさんのAPIが使えます — それらは JavaScript 言語本体の一部ではなく、あなたにスーパーパワーを与えるべく JavaScript 言語のコアの上に築かれた代物です。それらはおおよそ二つのカテゴリに分けられます:</p>
 
 <ul>
- <li><strong>ブラウザー API</strong> は Web ブラウザーに組込まれていて、ブラウザーやコンピューターの環境の情報を取得し、これを使って役に立つややこしい事を行えるようにするものです。 例えば <a href="/en-US/docs/Web/API/Geolocation_API">Geolocation API</a> は位置情報を取得するための簡単な JavaScript 構造を提供するので、例えばグーグルマップにあなたの居場所を表示するような事ができます。裏で実際にはブラウザーは低レベル (例えば C++) の複雑なコードをいくつか使ってデバイスの GPS 機器 (あるいは位置情報を得られる他のなんだか) と通信し、位置情報を取得し、コードから利用できるようにブラウザー環境に情報を戻しています。ですがここでもこの複雑な事柄は API で抽象化され隠蔽されます。</li>
+ <li><strong>ブラウザー API</strong> は Web ブラウザーに組込まれていて、ブラウザーやコンピューターの環境の情報を取得し、これを使って役に立つややこしい事を行えるようにするものです。 例えば <a href="/ja/docs/Web/API/Geolocation_API">Geolocation API</a> は位置情報を取得するための簡単な JavaScript 構造を提供するので、例えばグーグルマップにあなたの居場所を表示するような事ができます。裏で実際にはブラウザーは低レベル (例えば C++) の複雑なコードをいくつか使ってデバイスの GPS 機器 (あるいは位置情報を得られる他のなんだか) と通信し、位置情報を取得し、コードから利用できるようにブラウザー環境に情報を戻しています。ですがここでもこの複雑な事柄は API で抽象化され隠蔽されます。</li>
  <li><strong>サードパーティ API</strong> はデフォルトではブラウザーに組込まれておらず、普通はコードと情報を Web のどこから読み込まねばなりません。例えば <a href="https://dev.twitter.com/overview/documentation">Twitter API</a> を使えばあなたの Web サイトにあなたの最新のツイートを表示するような事が可能になります。Twitter API は、Twitter サービスに特定の情報を要求したりするのに使える特別な構造のかたまりを提供します。</li>
 </ul>
 
@@ -71,10 +71,10 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Introduction
 <p>ここまででクライアントサイド API とは何か、JavaScript 言語とどう関係しているのかお話しました。もっとはっきりさせるために一度おさらいして、ついでに他の JavaScript ツールがどう関係してくるのかもお話しましょう:</p>
 
 <ul>
- <li>JavaScript — ブラウザーに組込まれた高レベルスクリプト言語で、Web ページやアプリに機能を実装するのに使えます。<a href="/en-US/docs/Learn/Server-side/Express_Nodejs/Introduction">Node</a> のようなブラウザー以外の他のプログラミング環境でも使えるのは覚えておいて下さい。</li>
+ <li>JavaScript — ブラウザーに組込まれた高レベルスクリプト言語で、Web ページやアプリに機能を実装するのに使えます。<a href="/ja/docs/Learn/Server-side/Express_Nodejs/Introduction">Node</a> のようなブラウザー以外の他のプログラミング環境でも使えるのは覚えておいて下さい。</li>
  <li>ブラウザー API — ブラウザーに組込みの JavaScript 言語の上にある構造で、何かの機能をもっと簡単に実装できるようにします。</li>
  <li>サードパーティ API — サードパーティのプラットフォーム (Twitter や Facebook) 上に作られた構造で、それらのプラットフォームの機能を Web ページで利用できるようにします (例えばあなたの最新のツイートをあなたの Web ページに表示する)。</li>
- <li>JavaScript ライブラリ — 多くは、<a href="/en-US/docs/Learn/JavaScript/Building_blocks/Functions#custom_functions">独自の関数</a> を含んだ一つか複数の JavaScript ファイルで、Web ページにくっつけることでスピードアップしたり共通の機能を書いたりできるものです。例えば、jQuery、Mootools や React がなどが含まれます。</li>
+ <li>JavaScript ライブラリ — 多くは、<a href="/ja/docs/Learn/JavaScript/Building_blocks/Functions#custom_functions">独自の関数</a> を含んだ一つか複数の JavaScript ファイルで、Web ページにくっつけることでスピードアップしたり共通の機能を書いたりできるものです。例えば、jQuery、Mootools や React がなどが含まれます。</li>
  <li>JavaScript フレームワーク — ライブラリの一階層上にあたり、JavaScript フレームワーク (例えば Angular や Ember) は HTML や CSS に JavaScript、インストールして一から Web アプリケーションを作成するのに使えるその他もろもろの技術がパッケージ化されている場合が多いです。ライブラリとフレームワークの大きな相違点は、「制御の逆転 (Inversion of Control)」にあります。ライブラリのメソッドを呼ぶ時には、開発者がコントロールしています。フレームワークでは、コントロールが逆転します: フレームワークから開発者のコードが呼ばれるのです。</li>
 </ul>
 
@@ -88,9 +88,9 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Introduction
 
 <ul>
  <li>ブラウザーで読み込んだ<strong>文書を操作するための API</strong>。一番目にする例は <a href="/ja/docs/Web/API/Document_Object_Model">DOM (Document Object Model) API</a> で、 HTML と CSS を操作できます — HTML を作成したり削除したり書き換えたり、動的に新しいスタイルをページに適用したり、などなど。例えばページにポップアップウィンドウが表われたり、何か新しい中身が表示されたりする時、DOM が使われています。この種の API については<a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents#the_document_object_model">ドキュメントの操作</a>でもっといろいろ見られます。</li>
- <li><strong>サーバからデータ取得をする API</strong> で Web ページの一部を書き換える事はとてもよく行なわれます。この一見ちょっとした事が、サイトのパフォーマンスや振舞いに巨大なインパクトを与えました  — 在庫一覧や新しいお話一覧を書き換えたい時に、サーバからページ全体をリロードする事なしにさくっとできたら、サイトやアプリはずっと反応よく素早く感じられます。これを可能にした API には <a href="/en-US/docs/Web/API/XMLHttpRequest" title="XMLHttpRequest is an API that provides client functionality for transferring data between a client and a server. It provides an easy way to retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just a part of the page without disrupting what the user is doing."><code>XMLHttpRequest</code></a> と <a href="/en-US/docs/Web/API/Fetch_API">Fetch API</a> が含まれています。<strong>Ajax</strong> という言葉を聞いた事があるかもしれませんが、これがこのテクニックの呼び名です。これらの API について <a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">サーバからのデータ取得</a>でもっといろいろ見られます。</li>
+ <li><strong>サーバからデータ取得をする API</strong> で Web ページの一部を書き換える事はとてもよく行なわれます。この一見ちょっとした事が、サイトのパフォーマンスや振舞いに巨大なインパクトを与えました  — 在庫一覧や新しいお話一覧を書き換えたい時に、サーバからページ全体をリロードする事なしにさくっとできたら、サイトやアプリはずっと反応よく素早く感じられます。これを可能にした API には <a href="/ja/docs/Web/API/XMLHttpRequest" title="XMLHttpRequest is an API that provides client functionality for transferring data between a client and a server. It provides an easy way to retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just a part of the page without disrupting what the user is doing."><code>XMLHttpRequest</code></a> と <a href="/ja/docs/Web/API/Fetch_API">Fetch API</a> が含まれています。<strong>Ajax</strong> という言葉を聞いた事があるかもしれませんが、これがこのテクニックの呼び名です。これらの API について <a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">サーバからのデータ取得</a>でもっといろいろ見られます。</li>
  <li><strong>グラフィックスを描画したり操作する API</strong> は多くのブラウザーがサポートしています — 最も知られているものには<a href="/ja/docs/Web/API/Canvas_API"> Canvas</a> と <a href="/ja/docs/Web/API/WebGL_API">WebGL</a> があり、HTML の{{htmlelement("canvas")}} 要素上にあるピクセルデータを書き換えて2次元や3次元のシーンを作成するのに使えます。例えばキャンバスAPIを使って長方形や円のような形を描いたり、キャンバスに画像を読み込んだり、セピアやグレイスケールといったフィルターを適用したり、あるいは WebGL を使ってライティングやテクスチャを使った3Dシーンを作成したりできます。これらの API はよくアニメーションループを作成するAPI({{domxref("window.requestAnimationFrame()")}} など)や他のものと組み合わせて使われ、アニメやゲームのようなものの表示を定期的に書き換えるようにします。</li>
- <li><strong><a href="/en-US/docs/Web/Guide/Audio_and_video_delivery">動画と音声の API</a></strong> {{domxref("HTMLMediaElement")}}や <a href="/ja/docs/Web/API/Web_Audio_API">Web Audio API</a> や <a href="/ja/docs/Web/API/WebRTC_API">WebRTC</a> のような API を使うと、 マルチメディアを使ってとても面白い事ができます。音声や動画再生のための独自のコントロールUIの作成、字幕やサブタイトルのような音声トラックをビデオと一緒に表示したり、Web カメラの画像を取り込んで操作し、上述のキャンバスに表示したり Web カンファレンスに参加している他の誰かのコンピューター上に表示したり、音声トラックにイフェクト(ゲイン、ディストーション、音場効果など)をかけたりできます。</li>
+ <li><strong><a href="/ja/docs/Web/Guide/Audio_and_video_delivery">動画と音声の API</a></strong> {{domxref("HTMLMediaElement")}}や <a href="/ja/docs/Web/API/Web_Audio_API">Web Audio API</a> や <a href="/ja/docs/Web/API/WebRTC_API">WebRTC</a> のような API を使うと、 マルチメディアを使ってとても面白い事ができます。音声や動画再生のための独自のコントロールUIの作成、字幕やサブタイトルのような音声トラックをビデオと一緒に表示したり、Web カメラの画像を取り込んで操作し、上述のキャンバスに表示したり Web カンファレンスに参加している他の誰かのコンピューター上に表示したり、音声トラックにイフェクト(ゲイン、ディストーション、音場効果など)をかけたりできます。</li>
  <li><strong>デバイス API</strong> は基本的に Web アプリで使えるような形で、今時のハードウェアデバイスのデータを操作したり取得する API です。デバイスの位置データにアクセスして地図上にあなたの居場所を書くような位置情報 API についてはすでにお話しました。他の例にはシステム通知を使って Web アプリに役に立つアップデートがあるのを知らせたり(<a href="/ja/docs/Web/API/Notifications_API">Notifications API</a> を参照)、ハードウェアを振動させたり(<a href="/ja/docs/Web/API/Vibration_API">Vibration API</a> を参照)などがあります。</li>
  <li><strong>クライアント側でのデータ保持 API </strong>は今多くのブラウザーに普及しつつあります。— クライアント側にデータを保存できると、ページを移動しても状態を保存したり、たとえデバイスがオフラインでも動作するようなアプリを作成したいような場合、とても役に立ちます。いくつもの選択肢があり、例えば <a href="/ja/docs/Web/API/Web_Storage_API">Web Storage API</a> を使ったキーバリューストアや、 <a href="/ja/docs/Web/API/IndexedDB_API">IndexedDB API</a> を使ったもっと複雑なテーブル型データ保存などです。</li>
 </ul>
@@ -242,7 +242,7 @@ const ctx = canvas.getContext('2d');</pre>
 
 <p class="simple-translate-result" style="color: rgb(0, 0, 0);">上記の Web Audio API の例では、すでにいくつかのイベントハンドラーが使用されています。</p>
 
-<p>別の例として、<code><a href="/en-US/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code> オブジェクトのインスタンス (一つ一つがサーバから何らかの新しいリソースを取得しようとするHTTPリクエストを表わします) にはとてもたくさんのイベントが付随しており、たとえば <code>load</code> イベントは発火したリソースに対する正常なレスポンスが返ってきて、それが使えるようになった時点で発火します。</p>
+<p>別の例として、<code><a href="/ja/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code> オブジェクトのインスタンス (一つ一つがサーバから何らかの新しいリソースを取得しようとするHTTPリクエストを表わします) にはとてもたくさんのイベントが付随しており、たとえば <code>load</code> イベントは発火したリソースに対する正常なレスポンスが返ってきて、それが使えるようになった時点で発火します。</p>
 
 <p>次のコードはこれをどう使うのか示す簡単な例です:</p>
 
@@ -274,7 +274,7 @@ request.onload = function() {
 
 <p><img alt="" src="notification-permission.png" style="border-style: solid; border-width: 1px; display: block; margin: 0px auto;"></p>
 
-<p>Web Audio および {{domxref("HTMLMediaElement")}} API には、<a href="/en-US/docs/Web/API/Web_Audio_API/Best_practices#autoplay_policy">自動再生 (autoplay) ポリシー</a> と呼ばれるセキュリティ機構が適用されます。これは、基本的に、ページの読み込み時に音声を自動的に再生できないことを意味します。ユーザーに次のことを許可する必要があります。ボタンのようなコントロールを介して音声再生を開始します。これは、音声の自動再生は通常非常に煩わしいものであり、ユーザーにそれを課すべきではないためです。</p>
+<p>Web Audio および {{domxref("HTMLMediaElement")}} API には、<a href="/ja/docs/Web/API/Web_Audio_API/Best_practices#autoplay_policy">自動再生 (autoplay) ポリシー</a> と呼ばれるセキュリティ機構が適用されます。これは、基本的に、ページの読み込み時に音声を自動的に再生できないことを意味します。ユーザーに次のことを許可する必要があります。ボタンのようなコントロールを介して音声再生を開始します。これは、音声の自動再生は通常非常に煩わしいものであり、ユーザーにそれを課すべきではないためです。</p>
 
 <div class="blockIndicator note">
 <p><strong>注記</strong>: ブラウザーの厳格さによっては、このようなセキュリティ機構により、例がローカルで機能しなくなる場合があります。つまり、ローカルの例のファイルをウェブサーバーから実行するのではなく、ブラウザーに読み込んだ場合です。執筆時点では、Web Audio API の例はローカルでは Google Chrome で動作しません。動作する前に、GitHub にアップロードする必要がありました。</p>
@@ -289,7 +289,7 @@ request.onload = function() {
 <h2 id="このモジュール">このモジュール</h2>
 
 <ul>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">Web API の紹介</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">Web API の紹介</a></li>
  <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents">ドキュメントの操作</a></li>
  <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">サーバからのデータ取得</a></li>
  <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Third_party_APIs">サードパーティ API</a></li>
diff --git a/files/ja/learn/javascript/client-side_web_apis/manipulating_documents/index.html b/files/ja/learn/javascript/client-side_web_apis/manipulating_documents/index.html
index b0c69f9d62..cc24830ba5 100644
--- a/files/ja/learn/javascript/client-side_web_apis/manipulating_documents/index.html
+++ b/files/ja/learn/javascript/client-side_web_apis/manipulating_documents/index.html
@@ -44,7 +44,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents
 <p><img alt="" src="https://mdn.mozillademos.org/files/14557/document-window-navigator.png" style="display: block; margin: 0 auto;"></p>
 
 <ul>
- <li>ウィンドウはウェブページが読み込まれる部分の回りのブラウザーの枠です。これは JavaScript では {{domxref("Window")}} オブジェクトで表わされます。このオブジェクトに備わるメソッドを使って、ウィンドウの大きさを調べたり ({{domxref("Window.innerWidth")}} と {{domxref("Window.innerHeight")}} を参照)、ウィンドウに読み込まれる文書を操作したり、その文書に関係するデータをクライアント側(例えばローカルデータベースや他のデータ保存機構)で保存したり、現在のウィンドウに対して<a href="/docs/Learn/JavaScript/Building_blocks/Events#A_series_of_fortunate_events">イベントハンドラー</a> を追加したり、などできます。</li>
+ <li>ウィンドウはウェブページが読み込まれる部分の回りのブラウザーの枠です。これは JavaScript では {{domxref("Window")}} オブジェクトで表わされます。このオブジェクトに備わるメソッドを使って、ウィンドウの大きさを調べたり ({{domxref("Window.innerWidth")}} と {{domxref("Window.innerHeight")}} を参照)、ウィンドウに読み込まれる文書を操作したり、その文書に関係するデータをクライアント側(例えばローカルデータベースや他のデータ保存機構)で保存したり、現在のウィンドウに対して<a href="/ja/docs/Learn/JavaScript/Building_blocks/Events#A_series_of_fortunate_events">イベントハンドラー</a> を追加したり、などできます。</li>
  <li>ナビゲータはブラウザーの状態やウェブで使われているようなブラウザーの身元(つまりユーザーエージェント)を表わします。JavaScript では {{domxref("Navigator")}} オブジェクトで表わされます。このオブジェクトを使って、位置情報、ユーザが好む言語、ユーザのウェブカムからの録画データ、などを取得できます。</li>
  <li>ドキュメント(ブラウザーでは DOM として表現されます)はウィンドウに実際に読み込まれているページのことで、JavaScript では {{domxref("Document")}} オブジェクトで表わされます。このオブジェクトを使って文書を構成する HTML と CSS 上の情報を調べたり操作したりできて、例えば DOM の中のある要素に対する参照を得たり、その中身のテキストを変更したり、新しいスタイルを適用したり、新しい要素を作成して現在の要素の子に追加したり、一緒くたに削除したりできます。</li>
 </ul>
@@ -112,7 +112,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Manipulating_documents
 </ol>
 
 <div>
-<p>JavaScript あるあるですが、要素を選んで変数に保存する方法にはいろんなやり方があることを頭に入れておいて下さい。{{domxref("Document.querySelector()")}} を使うのが推奨される今風のやり方ですが、これは CSS セレクタと同じ方法で要素を選別できるからです。上記の <code>querySelector()</code> 呼び出しでは文書に現われる最初の {{htmlelement("a")}} がマッチします。もし複数の要素を選択し処理したいのであれば {{domxref("Document.querySelectorAll()")}} を使うことができて、これはセレクタとマッチする全ての要素にマッチし、それらへの参照を {{domxref("NodeList")}} と呼ばれる<a href="/docs/Learn/JavaScript/First_steps/Arrays">配列</a>のようなオブジェクトに保存します。</p>
+<p>JavaScript あるあるですが、要素を選んで変数に保存する方法にはいろんなやり方があることを頭に入れておいて下さい。{{domxref("Document.querySelector()")}} を使うのが推奨される今風のやり方ですが、これは CSS セレクタと同じ方法で要素を選別できるからです。上記の <code>querySelector()</code> 呼び出しでは文書に現われる最初の {{htmlelement("a")}} がマッチします。もし複数の要素を選択し処理したいのであれば {{domxref("Document.querySelectorAll()")}} を使うことができて、これはセレクタとマッチする全ての要素にマッチし、それらへの参照を {{domxref("NodeList")}} と呼ばれる<a href="/ja/docs/Learn/JavaScript/First_steps/Arrays">配列</a>のようなオブジェクトに保存します。</p>
 
 <p>要素への参照を得るための、次のような古いやり方もあります:</p>
 
@@ -190,7 +190,7 @@ para.style.padding = '10px';
 para.style.width = '250px';
 para.style.textAlign = 'center';</pre>
  </li>
- <li>ページをリロードすると指定のパラグラフにスタイルが適用されているはずです。ブラウザーの <a href="/docs/Tools/Page_Inspector">Page Inspector や DOM inspector</a> からパラグラフを見ると、言うまでもなく上の行がドキュメントのインラインスタイルに追加されているはずです:
+ <li>ページをリロードすると指定のパラグラフにスタイルが適用されているはずです。ブラウザーの <a href="/ja/docs/Tools/Page_Inspector">Page Inspector や DOM inspector</a> からパラグラフを見ると、言うまでもなく上の行がドキュメントのインラインスタイルに追加されているはずです:
   <pre class="brush: html notranslate">&lt;p style="color: white; background-color: black; padding: 10px; width: 250px; text-align: center;"&gt;We hope you enjoyed the ride.&lt;/p&gt;</pre>
  </li>
 </ol>
@@ -282,15 +282,15 @@ div.style.height = winHeight + 'px';</pre>
 <ol>
  <li>まず私たちが用意した <a href="https://github.com/mdn/learning-area/blob/master/javascript/apis/document-manipulation/shopping-list.html">shopping-list.html</a> 初期ファイルをダウンロードしてローカルコピーをどこかに作成します。最小限の CSS、ラベルのついたリスト、inputとボタン、空のリストと {{htmlelement("script")}} 要素が書いてあるはずです。この先書き足していくものは全部 script の中に書きます。</li>
  <li>({{htmlelement("ul")}}) と {{htmlelement("input")}} と {{htmlelement("button")}} 要素への参照を保持する3つの変数を作成します。</li>
- <li>ボタンがクリックされた時の応答として走らせる <a href="/docs/Learn/JavaScript/Building_blocks/Functions">関数</a> を作成します。</li>
- <li>関数本体は、input 要素の現在の <a href="/docs/Web/API/HTMLInputElement#Properties">値</a>を変数に保存するところから始めます。</li>
+ <li>ボタンがクリックされた時の応答として走らせる <a href="/ja/docs/Learn/JavaScript/Building_blocks/Functions">関数</a> を作成します。</li>
+ <li>関数本体は、input 要素の現在の <a href="/ja/docs/Web/API/HTMLInputElement#Properties">値</a>を変数に保存するところから始めます。</li>
  <li>次に、input 要素の値に空文字列(<code>''</code>)を代入して、input 要素を空にします。</li>
  <li>3つの要素を作成します — リスト項目({{htmlelement('li')}}) と {{htmlelement('span')}} と {{htmlelement('button')}} で、これらを変数に保存します。</li>
  <li>span と button をリスト項目 li の子に追加します。</li>
  <li>spanのテキストコンテントに、先程保存した input 要素の値を代入し、ボタンのテキストコンテントを「削除」にします。</li>
  <li>できたリスト項目をリストの子に追加します。</li>
  <li>削除ボタンにイベントハンドラーを追加して、クリックされたらボタンが含まれているリスト項目全体を削除するようにします。</li>
- <li>最後に、<code><a href="/docs/Web/API/HTMLElement/focus">focus()</a></code>メソッドを使って input 要素にフォーカスし、次の買い物リスト商品をすぐに入力できるようにします。</li>
+ <li>最後に、<code><a href="/ja/docs/Web/API/HTMLElement/focus">focus()</a></code>メソッドを使って input 要素にフォーカスし、次の買い物リスト商品をすぐに入力できるようにします。</li>
 </ol>
 
 <div class="note">
@@ -312,7 +312,7 @@ div.style.height = winHeight + 'px';</pre>
  <li>{{domxref("HTMLElement")}}, {{domxref("HTMLInputElement")}}, {{domxref("HTMLImageElement")}}, etc.</li>
 </ul>
 
-<p>(私共の <a href="https://developer.mozilla.org/docs/Web/API">Web API index</a> から、MDNにあるウェブAPIに関する全ドキュメント一覧も見て下さい!)</p>
+<p>(私共の <a href="/ja/docs/Web/API">Web API index</a> から、MDNにあるウェブAPIに関する全ドキュメント一覧も見て下さい!)</p>
 
 <div>{{PreviousMenuNext("Learn/JavaScript/Client-side_web_APIs/Introduction", "Learn/JavaScript/Client-side_web_APIs/Fetching_data", "Learn/JavaScript/Client-side_web_APIs")}}</div>
 
@@ -320,13 +320,13 @@ div.style.height = winHeight + 'px';</pre>
 <h2 id="このモジュール内の文書">このモジュール内の文書</h2>
 
 <ul>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">ウェブAPIの紹介</a></li>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents">ドキュメントの操作</a></li>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">サーバからのデータ取得</a></li>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Third_party_APIs">サードパーティAPI</a></li>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Drawing_graphics">絵を描く</a></li>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs">動画と音声のAPI</a></li>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage">クライアント側でのデータ保持</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">ウェブAPIの紹介</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents">ドキュメントの操作</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">サーバからのデータ取得</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Third_party_APIs">サードパーティAPI</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Drawing_graphics">絵を描く</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs">動画と音声のAPI</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage">クライアント側でのデータ保持</a></li>
 </ul>
 </div>
 
diff --git a/files/ja/learn/javascript/client-side_web_apis/third_party_apis/index.html b/files/ja/learn/javascript/client-side_web_apis/third_party_apis/index.html
index f1573f8af8..c5451b0186 100644
--- a/files/ja/learn/javascript/client-side_web_apis/third_party_apis/index.html
+++ b/files/ja/learn/javascript/client-side_web_apis/third_party_apis/index.html
@@ -262,7 +262,7 @@ function fetchResults(e) {
 </div>
 
 <div class="note">
-<p><strong>Note</strong>: この例では初歩的なフォームデータの検証を行っています — 検索語フィールドは、フォームを送信する前に入力しなければなりません (<code>required</code> 属性を使用して達成されます)。日付フィールドには <code>pattern</code> 属性が指定されており、値が 8 個の数字 (<code>pattern="[0-9]{8}"</code>) で構成されていないと送信されません。これらがどのように機能するかについての詳細は <a href="/ja/en-US/docs/Learn/HTML/Forms/Form_validation">Form data validation</a> を参照してください。</p>
+<p><strong>Note</strong>: この例では初歩的なフォームデータの検証を行っています — 検索語フィールドは、フォームを送信する前に入力しなければなりません (<code>required</code> 属性を使用して達成されます)。日付フィールドには <code>pattern</code> 属性が指定されており、値が 8 個の数字 (<code>pattern="[0-9]{8}"</code>) で構成されていないと送信されません。これらがどのように機能するかについての詳細は <a href="/ja/docs/Learn/HTML/Forms/Form_validation">Form data validation</a> を参照してください。</p>
 </div>
 
 <h3 id="API_からデータを要求する">API からデータを要求する</h3>
diff --git a/files/ja/learn/javascript/client-side_web_apis/video_and_audio_apis/index.html b/files/ja/learn/javascript/client-side_web_apis/video_and_audio_apis/index.html
index 09e6e27ca7..bcc0c856c3 100644
--- a/files/ja/learn/javascript/client-side_web_apis/video_and_audio_apis/index.html
+++ b/files/ja/learn/javascript/client-side_web_apis/video_and_audio_apis/index.html
@@ -23,7 +23,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs
  <tbody>
   <tr>
    <th scope="row">前提条件:</th>
-   <td>JavaScript basics (see <a href="/en-US/docs/Learn/JavaScript/First_steps">first steps</a>, <a href="/en-US/docs/Learn/JavaScript/Building_blocks">building blocks</a>, <a href="/en-US/docs/Learn/JavaScript/Objects">JavaScript objects</a>), the <a href="/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">basics of Client-side APIs</a></td>
+   <td>JavaScript basics (see <a href="/ja/docs/Learn/JavaScript/First_steps">first steps</a>, <a href="/ja/docs/Learn/JavaScript/Building_blocks">building blocks</a>, <a href="/ja/docs/Learn/JavaScript/Objects">JavaScript objects</a>), the <a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">basics of Client-side APIs</a></td>
   </tr>
   <tr>
    <th scope="row">目的:</th>
@@ -34,7 +34,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs
 
 <h2 id="HTML5_video_と_audio">HTML5 video と audio</h2>
 
-<p>The {{htmlelement("video")}} and {{htmlelement("audio")}} elements allow us to embed video and audio into web pages. As we showed in <a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">Video and audio content</a>, a typical implementation looks like this:</p>
+<p>The {{htmlelement("video")}} and {{htmlelement("audio")}} elements allow us to embed video and audio into web pages. As we showed in <a href="/ja/docs/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">Video and audio content</a>, a typical implementation looks like this:</p>
 
 <pre class="brush: html notranslate">&lt;video controls&gt;
   &lt;source src="rabbit320.mp4" type="video/mp4"&gt;
@@ -160,7 +160,7 @@ button:before {
 
 <ul>
  <li>We use the {{cssxref("::before")}} selector to display the content before each {{htmlelement("button")}} element.</li>
- <li>We use the {{cssxref("content")}} property to set the content to be displayed in each case to be equal to the contents of the <code><a href="/en-US/docs/Learn/HTML/Howto/Use_data_attributes">data-icon</a></code> attribute. In the case of our play button, <code>data-icon</code> contains a capital "P".</li>
+ <li>We use the {{cssxref("content")}} property to set the content to be displayed in each case to be equal to the contents of the <code><a href="/ja/docs/Learn/HTML/Howto/Use_data_attributes">data-icon</a></code> attribute. In the case of our play button, <code>data-icon</code> contains a capital "P".</li>
  <li>We apply the custom web font to our buttons using {{cssxref("font-family")}}. In this font, "P" is actually a "play" icon, so therefore the play button has a "play" icon displayed on it.</li>
 </ul>
 
@@ -267,7 +267,7 @@ controls.style.visibility = 'visible';</pre>
   }
 }</pre>
 
-  <p>Here we use an <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/if...else">if</a></code> statement to check whether the video is paused. The {{domxref("HTMLMediaElement.paused")}} property returns true if the media is paused, which is any time the video is not playing, including when it is set at 0 duration after it first loads. If it is paused, we set the <code>data-icon</code> attribute value on the play button to "u", which is a "paused" icon, and invoke the {{domxref("HTMLMediaElement.play()")}} method to play the media.</p>
+  <p>Here we use an <code><a href="/ja/docs/Web/JavaScript/Reference/Statements/if...else">if</a></code> statement to check whether the video is paused. The {{domxref("HTMLMediaElement.paused")}} property returns true if the media is paused, which is any time the video is not playing, including when it is set at 0 duration after it first loads. If it is paused, we set the <code>data-icon</code> attribute value on the play button to "u", which is a "paused" icon, and invoke the {{domxref("HTMLMediaElement.play()")}} method to play the media.</p>
 
   <p>On the second click, the button will be toggled back again — the "play" icon will be shown again, and the video will be paused with {{domxref("HTMLMediaElement.pause()")}}.</p>
  </li>
@@ -277,7 +277,7 @@ controls.style.visibility = 'visible';</pre>
 
 <ol>
  <li>
-  <p>Next, let's add functionality to handle stopping the video. Add the following <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code> lines below the previous one you added:</p>
+  <p>Next, let's add functionality to handle stopping the video. Add the following <code><a href="/ja/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code> lines below the previous one you added:</p>
 
   <pre class="brush: js notranslate">stop.addEventListener('click', stopMedia);
 media.addEventListener('ended', stopMedia);
@@ -307,7 +307,7 @@ media.addEventListener('ended', stopMedia);
 
 <ol>
  <li>
-  <p>First of all, add the following two <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code> lines below the previous ones:</p>
+  <p>First of all, add the following two <code><a href="/ja/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code> lines below the previous ones:</p>
 
   <pre class="brush: js notranslate">rwd.addEventListener('click', mediaBackward);
 fwd.addEventListener('click', mediaForward);
@@ -473,7 +473,7 @@ clearInterval(intervalFwd);
   <p>Because <code>&lt;audio&gt;</code> elements have the same {{domxref("HTMLMediaElement")}} functionality available to them, you could easily get this player to work for an <code>&lt;audio&gt;</code> element too. Try doing so.</p>
  </li>
  <li>
-  <p>Can you work out a way to turn the timer inner <code>&lt;div&gt;</code> element into a true seek bar/scrobbler — i.e., when you click somewhere on the bar, it jumps to that relative position in the video playback? As a hint, you can find out the X and Y values of the element's left/right and top/bottom sides via the <code><a href="/en-US/docs/Web/API/Element/getBoundingClientRect">getBoundingClientRect()</a></code> method, and you can find the coordinates of a mouse click via the event object of the click event, called on the {{domxref("Document")}} object. For example:</p>
+  <p>Can you work out a way to turn the timer inner <code>&lt;div&gt;</code> element into a true seek bar/scrobbler — i.e., when you click somewhere on the bar, it jumps to that relative position in the video playback? As a hint, you can find out the X and Y values of the element's left/right and top/bottom sides via the <code><a href="/ja/docs/Web/API/Element/getBoundingClientRect">getBoundingClientRect()</a></code> method, and you can find the coordinates of a mouse click via the event object of the click event, called on the {{domxref("Document")}} object. For example:</p>
 
   <pre class="brush: js notranslate">document.onclick = function(e) {
   console.log(e.x) + ',' + console.log(e.y)
@@ -485,11 +485,11 @@ clearInterval(intervalFwd);
 
 <ul>
  <li>{{domxref("HTMLMediaElement")}}</li>
- <li><a href="/en-US/docs/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">Video and audio content</a> — simple guide to <code>&lt;video&gt;</code> and <code>&lt;audio&gt;</code> HTML.</li>
- <li><a href="/en-US/docs/Web/Apps/Fundamentals/Audio_and_video_delivery">Audio and video delivery</a> — detailed guide to delivering media inside the browser, with many tips, tricks, and links to further more advanced tutorials.</li>
- <li><a href="/en-US/docs/Web/Apps/Fundamentals/Audio_and_video_manipulation">Audio and video manipulation</a> — detailed guide to manipulating audio and video, e.g. with <a href="/en-US/docs/Web/API/Canvas_API">Canvas API</a>, <a href="/en-US/docs/Web/API/Web_Audio_API">Web Audio API</a>, and more.</li>
+ <li><a href="/ja/docs/Learn/HTML/Multimedia_and_embedding/Video_and_audio_content">Video and audio content</a> — simple guide to <code>&lt;video&gt;</code> and <code>&lt;audio&gt;</code> HTML.</li>
+ <li><a href="/ja/docs/Web/Apps/Fundamentals/Audio_and_video_delivery">Audio and video delivery</a> — detailed guide to delivering media inside the browser, with many tips, tricks, and links to further more advanced tutorials.</li>
+ <li><a href="/ja/docs/Web/Apps/Fundamentals/Audio_and_video_manipulation">Audio and video manipulation</a> — detailed guide to manipulating audio and video, e.g. with <a href="/ja/docs/Web/API/Canvas_API">Canvas API</a>, <a href="/ja/docs/Web/API/Web_Audio_API">Web Audio API</a>, and more.</li>
  <li>{{htmlelement("video")}} and {{htmlelement("audio")}} reference pages.</li>
- <li><a href="/en-US/docs/Web/Media/Formats">Guide to media types and formats on the web</a></li>
+ <li><a href="/ja/docs/Web/Media/Formats">Guide to media types and formats on the web</a></li>
 </ul>
 
 <p>{{PreviousMenuNext("Learn/JavaScript/Client-side_web_APIs/Drawing_graphics", "Learn/JavaScript/Client-side_web_APIs/Client-side_storage", "Learn/JavaScript/Client-side_web_APIs")}}</p>
@@ -497,11 +497,11 @@ clearInterval(intervalFwd);
 <h2 id="このモジュール">このモジュール</h2>
 
 <ul>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">Web API の紹介</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Introduction">Web API の紹介</a></li>
  <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Manipulating_documents">ドキュメントの操作</a></li>
  <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Fetching_data">サーバからのデータ取得</a></li>
  <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Third_party_APIs">サードパーティ API</a></li>
- <li><a href="/docs/Learn/JavaScript/Client-side_web_APIs/Drawing_graphics">グラフィックの描画</a></li>
+ <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Drawing_graphics">グラフィックの描画</a></li>
  <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Video_and_audio_APIs">動画と音声の API</a></li>
  <li><a href="/ja/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage">クライアント側ストレージ</a></li>
 </ul>