From 6ef1fa4618e08426b874529619a66adbd3d1fcf0 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 12:07:59 +0100 Subject: unslug ja: move --- .../web/api/canvas_api/tutorial/index.html | 60 ++ .../index.html | 213 +++++++ .../web/api/crypto/getrandomvalues/index.html | 113 ++++ .../index.html | 31 ++ .../web/api/document/characterset/index.html | 26 + .../web/api/document/createevent/index.html | 32 ++ .../web/api/document_object_model/index.html | 5 + .../index.html | 16 + .../index.html | 37 ++ .../index.html | 52 ++ .../documentorshadowroot/getselection/index.html | 13 + .../web/api/documentorshadowroot/index.html | 79 +++ .../index.html | 83 +++ .../api/element/compositionstart_event/index.html | 80 +++ files/ja/conflicting/web/api/element/index.html | 50 ++ .../api/formdata/using_formdata_objects/index.html | 145 +++++ .../web/api/globaleventhandlers/onclick/index.html | 45 ++ .../api/globaleventhandlers/onmousedown/index.html | 48 ++ .../api/globaleventhandlers/onmouseup/index.html | 57 ++ .../web/api/html_drag_and_drop_api/index.html | 9 + files/ja/conflicting/web/api/index.html | 58 ++ .../web/api/mediastream_recording_api/index.html | 187 +++++++ .../web/api/mouseevent/button/index.html | 60 ++ files/ja/conflicting/web/api/navigator/index.html | 620 +++++++++++++++++++++ files/ja/conflicting/web/api/node/index.html | 33 ++ .../index.html | 21 + files/ja/conflicting/web/api/url/index.html | 101 ++++ .../conflicting/web/api/web_storage_api/index.html | 14 + .../tutorial/using_textures_in_webgl/index.html | 16 + .../conflicting/web/api/websockets_api/index.html | 23 + .../conflicting/web/api/window/moveto/index.html | 11 + .../web/api/windoworworkerglobalscope/index.html | 116 ++++ .../index.html | 119 ++++ .../conflicting/web/api/xsltprocessor/index.html | 12 + 34 files changed, 2585 insertions(+) create mode 100644 files/ja/conflicting/web/api/canvas_api/tutorial/index.html create mode 100644 files/ja/conflicting/web/api/canvas_api/tutorial_3cd5468edc15a1ef1ddc0d2b17e1fa5d/index.html create mode 100644 files/ja/conflicting/web/api/crypto/getrandomvalues/index.html create mode 100644 files/ja/conflicting/web/api/css_object_model/determining_the_dimensions_of_elements/index.html create mode 100644 files/ja/conflicting/web/api/document/characterset/index.html create mode 100644 files/ja/conflicting/web/api/document/createevent/index.html create mode 100644 files/ja/conflicting/web/api/document_object_model/index.html create mode 100644 files/ja/conflicting/web/api/document_object_model_226486dcf4878082093d6899a9e478cc/index.html create mode 100644 files/ja/conflicting/web/api/document_object_model_656f0e51418b39c498011268be9b3a10/index.html create mode 100644 files/ja/conflicting/web/api/document_object_model_8435a25d5137b436d5d7161e1b813c02/index.html create mode 100644 files/ja/conflicting/web/api/documentorshadowroot/getselection/index.html create mode 100644 files/ja/conflicting/web/api/documentorshadowroot/index.html create mode 100644 files/ja/conflicting/web/api/documentorshadowroot_20ea0e1d91453a020aad3a16dbce16f1/index.html create mode 100644 files/ja/conflicting/web/api/element/compositionstart_event/index.html create mode 100644 files/ja/conflicting/web/api/element/index.html create mode 100644 files/ja/conflicting/web/api/formdata/using_formdata_objects/index.html create mode 100644 files/ja/conflicting/web/api/globaleventhandlers/onclick/index.html create mode 100644 files/ja/conflicting/web/api/globaleventhandlers/onmousedown/index.html create mode 100644 files/ja/conflicting/web/api/globaleventhandlers/onmouseup/index.html create mode 100644 files/ja/conflicting/web/api/html_drag_and_drop_api/index.html create mode 100644 files/ja/conflicting/web/api/index.html create mode 100644 files/ja/conflicting/web/api/mediastream_recording_api/index.html create mode 100644 files/ja/conflicting/web/api/mouseevent/button/index.html create mode 100644 files/ja/conflicting/web/api/navigator/index.html create mode 100644 files/ja/conflicting/web/api/node/index.html create mode 100644 files/ja/conflicting/web/api/node_378aed5ed6869e50853edbc988cf9556/index.html create mode 100644 files/ja/conflicting/web/api/url/index.html create mode 100644 files/ja/conflicting/web/api/web_storage_api/index.html create mode 100644 files/ja/conflicting/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html create mode 100644 files/ja/conflicting/web/api/websockets_api/index.html create mode 100644 files/ja/conflicting/web/api/window/moveto/index.html create mode 100644 files/ja/conflicting/web/api/windoworworkerglobalscope/index.html create mode 100644 files/ja/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html create mode 100644 files/ja/conflicting/web/api/xsltprocessor/index.html (limited to 'files/ja/conflicting/web/api') diff --git a/files/ja/conflicting/web/api/canvas_api/tutorial/index.html b/files/ja/conflicting/web/api/canvas_api/tutorial/index.html new file mode 100644 index 0000000000..b84af866ef --- /dev/null +++ b/files/ja/conflicting/web/api/canvas_api/tutorial/index.html @@ -0,0 +1,60 @@ +--- +title: canvas チュートリアル +slug: Web/Guide/HTML/Canvas_tutorial +tags: + - Canvas + - Graphics + - Guide + - HTML + - HTML5 + - Intermediate + - Web +translation_of: Web/API/Canvas_API/Tutorial +--- +
{{CanvasSidebar}}
+ +
+ +
+

<canvas> 要素は、スクリプト (一般的に JavaScript) を使って図形を描くために使われる新しい HTML 要素です。例えば、グラフを描く、写真を合成する、または簡単な (またはあまり簡単ではない) アニメーションに使うことができます。このページの画像は後でこのチュートリアルの中でみる <canvas> を実際に使った例です。

+
+ +

このチュートリアルでは、2D グラフィックスを描画するために <canvas> 要素を使用する方法を、基礎から説明します。提供する例は、<canvas> で出来ることの、いくつかの明確なアイデアと、それをあなた自身のコンテンツで作成開始できるようなコードスニペットを提供します。

+ +

<canvas> は Apple によって OS X の Dashboard のために WebKit へ初めて導入され、後にブラウザーに実装されました。現在は、あらゆる主要ブラウザーがサポートしています。

+ +

始める前に

+ +

<canvas> を使うことはそれほど難しくはありませんが、HTML と JavaScript の基本的な理解が必要です。一部の古いブラウザーは <canvas> 要素をサポートしていませんが、最近のバージョンの主要ブラウザーはすべてサポートしています。canvas のデフォルトのサイズは、300 px × 150 px (幅 × 高さ) です。しかし、HTML の height および width プロパティを使用して、独自のサイズを定義することができます。canvas にグラフィックスを描画するためには、JavaScript コンテキストオブジェクトを使用します。このオブジェクトは、グラフィックスをオンザフライで生成します。

+ +

チュートリアル

+ + + +

関連情報

+ + + +

貢献者への注記

+ +

2013 年 6 月 17 日の週に発生した不運な技術的エラーにより、すべての過去の貢献者の属性を含む、このチュートリアルの履歴情報が失われました。この問題についておわびするとともに、この不運な事故を容赦願います。

+ +
{{Next("Web/API/Canvas_API/Tutorial/Basic_usage")}}
diff --git a/files/ja/conflicting/web/api/canvas_api/tutorial_3cd5468edc15a1ef1ddc0d2b17e1fa5d/index.html b/files/ja/conflicting/web/api/canvas_api/tutorial_3cd5468edc15a1ef1ddc0d2b17e1fa5d/index.html new file mode 100644 index 0000000000..be09a119f7 --- /dev/null +++ b/files/ja/conflicting/web/api/canvas_api/tutorial_3cd5468edc15a1ef1ddc0d2b17e1fa5d/index.html @@ -0,0 +1,213 @@ +--- +title: canvas に絵を描く +slug: Web/API/Canvas_API/Drawing_graphics_with_canvas +tags: + - HTML + - HTML5 + - 'HTML:Canvas' +translation_of: Web/API/Canvas_API/Tutorial +translation_of_original: Web/API/Canvas_API/Drawing_graphics_with_canvas +--- +
+

このページには、一部古い内容が含まれています。

+
+ +

イントロダクション

+ +

Firefox 1.5 より、 Firefox はプログラム可能な画像のための新しい HTML 要素を含みます。<canvas> は WHATWG の canvas の仕様を基にしています。WhatWG canvas 仕様自体は Safari で実装された Apple の <canvas> を基にしています。クライアント上でグラフ、UI 要素、および他のカスタムグラフィックスの描画に使用することができます。

+ +

<canvas> は 1 つ以上の描画コンテクスト を公開した固定サイズの描画表面を作ります。現在は 2 次元描画コンテクストのみが実装されています。 3D グラフィックスの描画には、 WebGL レンダリングコンテクストを用いると良いでしょう。

+ +

2 次元描画コンテクスト

+ +

初歩的な例

+ +

始めに、2 つの交差した長方形を描く簡単な例を見てみましょう。片方の長方形は透明度を持っています。

+ +
function draw() {
+  var myCanvas = document.getElementById('canvas');
+  var ctx = myCanvas.getContext('2d');
+
+  ctx.fillStyle = "rgb(200,0,0)";
+  ctx.fillRect (10, 10, 55, 50);
+
+  ctx.fillStyle = "rgba(0, 0, 200, 0.5)";
+  ctx.fillRect (30, 30, 55, 50);
+}
+
+ + + +
{{EmbedLiveSample('A_Simple_Example','150','150','/@api/deki/files/602/=Canvas_ex1.png')}}
+ +

draw 関数は、まず canvas 要素を取得し、次にその canvas 要素 の 2 次元レンダリングコンテクストを取得しています。 ctx オブジェクトは canvas に実際に描画するのに使うことができます。例では CSS color 仕様による 2 つの異なる色を fillStyle プロパティで設定し、fillRect メソッドにより 2 つの長方形を単純に塗りつぶしています。 2 つ目の fillStyle は色と一緒に透明度を定義するために rgba() を使っています。

+ +

fillRect() は矩形状の塗りつぶし、strokeRect() は矩形状の輪郭線の描画、 clearRect() はコンテクストの指定部分の消去に用います。より複雑な形を描画するにはパスを用います。

+ +

パスの利用

+ +

beginPath メソッドは新しいパスの作成を開始します。そして moveTo、lineTo、arcTo、arc などのメソッドはパスにセグメントを加えるのに使われます。パスは closePath メソッドによって閉じることが可能です。パスの作成後、fill か stroke を使って canvas コンテクストにパスを描画します。

+ +
function draw() {
+  var myCanvas = document.getElementById('canvas');
+  var ctx = myCanvas.getContext('2d');
+
+  ctx.fillStyle = "red";
+
+  ctx.beginPath();
+  ctx.moveTo(30, 30);
+  ctx.lineTo(150, 150);
+
+  // was: ctx.quadraticCurveTo(60, 70, 70, 150); これは間違い
+
+  ctx.bezierCurveTo(60, 70, 60, 70, 70, 150); // <- これが正しい書式 ->
+
+  ctx.lineTo(30, 30);
+
+  ctx.fill();
+}
+ + + +
{{EmbedLiveSample('Using_Paths','190','190','/@api/deki/files/603/=Canvas_ex2.png')}}
+ +

fill() か stroke() を呼ぶと現在のパスが使われます。 もう一度塗りつぶしか輪郭線を描くにはパスを再作成しなくてはなりません。

+ +

レンダリングコンテクストの状態

+ +

fillStyle 、strokeStyle 、lineWidth 、 lineJoin のようなコンテクストの属性は、現在のレンダリングコンテクストの状態の一部です。 コンテクストは現在の状態を状態スタックに格納したり取り出したりするために save() と restore() という 2 つのメソッドを提供してます。

+ +

より複雑な例

+ +

パス、状態、変換行列を用いた少し複雑な例を紹介します。 translate() 、scale() 、rotate() のコンテクストメソッドは全て現在の行列を変換します。 全ての描画された点は最初にこの行列により変換されます。

+ +
function drawBowtie(ctx, fillStyle) {
+
+  ctx.fillStyle = "rgba(200,200,200,0.3)";
+  ctx.fillRect(-30, -30, 60, 60);
+
+  ctx.fillStyle = fillStyle;
+  ctx.globalAlpha = 1.0;
+  ctx.beginPath();
+  ctx.moveTo(25, 25);
+  ctx.lineTo(-25, -25);
+  ctx.lineTo(25, -25);
+  ctx.lineTo(-25, 25);
+  ctx.closePath();
+  ctx.fill();
+}
+
+function dot(ctx) {
+  ctx.save();
+  ctx.fillStyle = "black";
+  ctx.fillRect(-2, -2, 4, 4);
+  ctx.restore();
+}
+
+function draw() {
+  var ctx = document.getElementById('canvas').getContext('2d');
+
+  // 以後の全て変換はこの変換から相対的であることに注意
+  ctx.translate(45, 45);
+
+  ctx.save();
+  //ctx.translate(0, 0); // 不要
+  drawBowtie(ctx, "red");
+  dot(ctx);
+  ctx.restore();
+
+  ctx.save();
+  ctx.translate(85, 0);
+  ctx.rotate(45 * Math.PI / 180);
+  drawBowtie(ctx, "green");
+  dot(ctx);
+  ctx.restore();
+
+  ctx.save();
+  ctx.translate(0, 85);
+  ctx.rotate(135 * Math.PI / 180);
+  drawBowtie(ctx, "blue");
+  dot(ctx);
+  ctx.restore();
+
+  ctx.save();
+  ctx.translate(85, 85);
+  ctx.rotate(90 * Math.PI / 180);
+  drawBowtie(ctx, "yellow");
+  dot(ctx);
+  ctx.restore();
+}
+
+ + + +
{{EmbedLiveSample('A_More_Complicated_Example','215','215','/@api/deki/files/604/=Canvas_ex3.png')}}
+ +

drawBotie 関数及び dot 関数を定義し、 draw 関数内で 4 回使用しています。 それぞれを呼び出す前に、translate() 及び rotate() を現在の変換行列を用意するために用いています。その変換行列は順番に点と蝶ネクタイを配置します。 dot 関数は (0, 0) を中心に小さな黒い正方形を描画します。 dot は変換行列によって移動されます。 drawBowtie は第 1 引数に指定した塗りつぶしスタイルを使い、単純な蝶ネクタイのパスを描画します。

+ +

行列の操作は累積されるので、save() 及び restore() はそれぞれが設定した元の canvas の状態に復帰するために使われます。 注目すべきは、回転が常に現在の基点の周りで起こるということです。 従って translate() rotate() translate() の連続は translate() translate() rotate() の連続実行とは異なった結果を生みます。

+ +

Apple の <canvas> との互換性

+ +

<canvas> は Apple の実装とその他の実装で互換性があります。 しかし、いくつかの注意すべき問題があります。

+ +

必須の </canvas> タグ このセクションの内容には古い情報が含まれます

+ +

Apple の Safari の実装においては、<canvas> は <img> とほぼ同じような方法で実装された要素で、終了タグを持っていません。 しかしながら、<canvas> がウェブで広く普及するために、 代替内容のための何らかの方法を提供しなければなりません。 したがって、Mozilla の実装では、 終了タグが必須となっています。

+ +

代替内容が必要無い場合、単純に <canvas id="foo" ...></canvas> とすれば、Safari は終了タグを無視し、 Safari と Mozilla の両方で完全に互換性を持つでしょう。

+ +

もし代替内容が望まれるならば、(canvas だけが描画されるべき) Safari から代替内容を隠すために、そして(代替内容が表示されるべき) IE から canvas 自体を隠すためにいくつかの CSS のトリックを使わなければなりません。

+ +

現在は canvas 要素の内容には代替コンテンツを配置するように仕様書で定められています。

+ +

その他の機能

+ +

canvas への Web コンテンツの描画

+ +
この機能は Chrome 特権コードの実行時のみに存在します。通常の HTML ページでは許可されていません。理由についてはソースをお読みください。
+ +

Mozilla の canvas は {{domxref("CanvasRenderingContext2D", "drawWindow()", "drawWindow()")}} メソッドで拡張できます。このメソッドは DOM window の中身のスナップショットを canvas に描画します。以下に例を示します。

+ +
ctx.drawWindow(window, 0, 0, 100, 200, "rgb(255,255,255)");
+
+ +

上記の例では、現在のウィンドウの、左上から (0, 0, 100, 200) 座標にある四角形の中身を、黒色背景の canvas に描き込みます。 遅くなりますが、 "rgba(255, 255, 255, 0)" と色を指定すれば、透過背景の上に中身を描画することになります。

+ +

このメソッドにより、隠し IFRAME に任意の内容 (たとえば、CSS でスタイル付けされた HTML テキストや SVG) を入れて、その内容を canvas に描画することも可能です。その場合、現在の変形にしたがって、拡大縮小・回転が行われます。

+ +

Ted Mielczarek の tab preview 拡張では、 Web ページのサムネイルを提供するために chrome の中でこのテクニックを使われています。ソースコードを参照してみてください。

+ +
注記: Using canvas.drawWindow() while handling a document's onload event doesn't work. In Firefox 3.5 or later, you can do this in a handler for the MozAfterPaint event to successfully draw HTML content into a canvas on page load.
+ +

関連情報

+ + diff --git a/files/ja/conflicting/web/api/crypto/getrandomvalues/index.html b/files/ja/conflicting/web/api/crypto/getrandomvalues/index.html new file mode 100644 index 0000000000..5972564d98 --- /dev/null +++ b/files/ja/conflicting/web/api/crypto/getrandomvalues/index.html @@ -0,0 +1,113 @@ +--- +title: RandomSource +slug: Web/API/RandomSource +tags: + - API + - Interface + - RandomSource + - Reference + - Web Crypto API +translation_of: Web/API/Crypto/getRandomValues +translation_of_original: Web/API/RandomSource +--- +

{{APIRef("Web Crypto API")}}

+ +

RandomSource は、暗号的に安全な乱数値のソースを表します。これは、グローバルオブジェクトの {{domxref("Crypto")}} オブジェクトを通して利用可能です。ウェブページ上では {{domxref("Window.crypto")}}、Worker 内では {{domxref("WorkerGlobalScope.crypto")}} が利用できます。

+ +

RandomSource は、インターフェイスでも、作成できるこの種類のオブジェクトでもありません。

+ +

プロパティ

+ +

RandomSource はどのプロパティも定義または継承しません。

+ +
+
+ +

メソッド

+ +
+
{{ domxref("RandomSource.getRandomValues()") }}
+
渡された {{ domxref("ArrayBufferView") }} を意味不明の乱数値で埋めます。
+
+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況備考
{{SpecName('Web Crypto API', '#dfn-RandomSource')}}{{Spec2('Web Crypto API')}}初期定義
+ +

ブラウザーの実装状況

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + + + +
機能ChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート11.0 {{ webkitbug("22049") }}{{CompatVersionUnknown}}{{CompatGeckoDesktop(21)}} [1]11.015.03.1
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
機能AndroidChrome for AndroidEdgeFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{ CompatNo() }}23{{CompatVersionUnknown}}{{CompatGeckoMobile(21)}}{{ CompatNo() }}{{ CompatNo() }}6
+
+ +

[1] RandomSource は Firefox 26 からのみ利用可能ですが、機能は Firefox 21 から利用可能でした。

+ +

関連情報

+ + diff --git a/files/ja/conflicting/web/api/css_object_model/determining_the_dimensions_of_elements/index.html b/files/ja/conflicting/web/api/css_object_model/determining_the_dimensions_of_elements/index.html new file mode 100644 index 0000000000..c09e67595e --- /dev/null +++ b/files/ja/conflicting/web/api/css_object_model/determining_the_dimensions_of_elements/index.html @@ -0,0 +1,31 @@ +--- +title: Determining the dimensions of elements +slug: Determining_the_dimensions_of_elements +tags: + - DOM +--- +

要素の幅と高さを知るためのプロパティはいくつかあり、本当に求めているプロパティがどれであるかわかりにくいことがあります。このページでは目的に応じてどのプロパティを使用すれば良いか説明します。

+ +

表示に使用されている領域の大きさはどのくらいか？

+ +

表示されているコンテンツ、スクロールバー(あれば)、padding の幅を含む element の占有スペースの総量を知る必要があるならば、offsetWidth プロパティと offsetHeight プロパティを利用するのが良いです:

+ +

Image:Dimensions-offset.png

+ +

表示されているコンテンツのサイズは何か?

+ +

border、margins、スクロールバーを含まない、実際に表示されているコンテンツの padding のみがどれくらいのスペースを取るか知る必要があるならば、 clientWidth プロパティと clientHeight プロパティを利用するのが良いです:

+ +

Image:Dimensions-client.png

+ +

コンテンツの大きさはどのくらいか?

+ +

現在どのくらい表示されているかに関わらず、コンテンツの実サイズを知る必要があるならば、scrollWidth プロパティと scrollHeight プロパティを利用するのが良いです。たとえ現在スクロールバーの使用のために一部分だけが見えているとしても、これらは element の全コンテンツの幅と高さを返します。

+ +

たとえば、600×400ピクセルの element が300x300ピクセルのスクロールボックスの中に表示されているならば、scrollHeightは400を、scrollWidthは600を返します。

+ +

リファレンス

+ +

MSDN: Measuring Element Dimension and Location

+ +

{{ languages( {"en": "en/Determining_the_dimensions_of_elements"}) }}

diff --git a/files/ja/conflicting/web/api/document/characterset/index.html b/files/ja/conflicting/web/api/document/characterset/index.html new file mode 100644 index 0000000000..bc128b09e8 --- /dev/null +++ b/files/ja/conflicting/web/api/document/characterset/index.html @@ -0,0 +1,26 @@ +--- +title: document.inputEncoding +slug: Web/API/Document/inputEncoding +tags: + - DOM + - Document + - Gecko + - Gecko DOM Reference +translation_of: Web/API/Document/characterSet +translation_of_original: Web/API/Document/inputEncoding +--- +

{{ApiRef}} {{deprecated_header}}

+

概要

+

文書パース時のエンコーディングを表す文字列（※ ISO-8859-1 等）を返します。

+
+ 注記: このメソッドは DOM 4 仕様書ドラフトから削除されており、Gecko の実装からも削除される可能性があります。使用しないようにしてください。
+

構文

+
encoding = document.inputEncoding;
+ +

仕様書

+ diff --git a/files/ja/conflicting/web/api/document/createevent/index.html b/files/ja/conflicting/web/api/document/createevent/index.html new file mode 100644 index 0000000000..d9dc6aef3f --- /dev/null +++ b/files/ja/conflicting/web/api/document/createevent/index.html @@ -0,0 +1,32 @@ +--- +title: Event.createEvent() +slug: Web/API/Event/createEvent +translation_of: Web/API/Document/createEvent +translation_of_original: Web/API/Event/createEvent +--- +

{{APIRef("DOM")}}

+ +

新規イベントを生成します。生成されたイベントは初期化処理が必須です。

+ +

構文

+ +
document.createEvent(type)
+ +
+
type
+
生成するイベントタイプ名
+
+ +

このメソッドは指定されたイベントタイプの新規DOM {{ domxref("Event") }} オブジェクトを返り値として返します。

+ +

オブジェクトには初期化処理が必須です。

+ +

例

+ +
var newEvent = document.createEvent("UIEvents");
+ +

仕様書

+ + diff --git a/files/ja/conflicting/web/api/document_object_model/index.html b/files/ja/conflicting/web/api/document_object_model/index.html new file mode 100644 index 0000000000..5bd2ec6ada --- /dev/null +++ b/files/ja/conflicting/web/api/document_object_model/index.html @@ -0,0 +1,5 @@ +--- +title: DOM Client Object Cross-Reference +slug: DOM_Client_Object_Cross-Reference +--- +{{wiki.localize('System.API.page-generated-for-subpage')}} diff --git a/files/ja/conflicting/web/api/document_object_model_226486dcf4878082093d6899a9e478cc/index.html b/files/ja/conflicting/web/api/document_object_model_226486dcf4878082093d6899a9e478cc/index.html new file mode 100644 index 0000000000..736d3074ba --- /dev/null +++ b/files/ja/conflicting/web/api/document_object_model_226486dcf4878082093d6899a9e478cc/index.html @@ -0,0 +1,16 @@ +--- +title: DOM (Document Object Model) について +slug: DOM/About_the_Document_Object_Model +tags: + - DOM +translation_of: Web/API/Document_Object_Model +translation_of_original: DOM/About_the_Document_Object_Model +--- +

DOM とは何か?

+

Document Object Model は HTML と XML ドキュメントへの API です。これは、ドキュメントの構造的な表現、その内容を変更可能にすること、そして視覚的なプレゼンテーションを提供します。本質的には、ウェブページをスクリプト又はプログラミング言語と結合します。

+

ウェブ開発者がウェブページを操作及び作成するのに役立つ全てのプロパティ、メソッド、そしてイベントは、objects に組込まれています。(例えば、document オブジェクトはドキュメントそのもの、table オブジェクトは HTML テーブル要素を表すなど)。これらのオブジェクトは最新のウェブブラウザのスクリプティング言語を通してアクセス可能です。

+

DOM は JavaScript との関連において最も頻繁に使われます。JavaScript で書かれたコードは、しかしウェブページとその要素にアクセスするのには DOM を使う為です。しかしながら、 DOM はあらゆる個々のプログラミング言語から独立して設計され、ドキュメントの構造的な表現の作成が、単独で、一貫した API により利用できます。当サイトでは終始 JavaScript に焦点を置きますが、DOM の実装はあらゆる言語 でビルドする事が出来ます。

+

World Wide Web Consortium は W3C DOM と呼ばれる DOM 標準を設けました。今こそ、有力なブラウザは正しくこれを実装し、強力なクロスブラウザアプリケーションを可能にすべきです。

+

何故 Mozilla が DOM をサポートすることが重要か

+

"Dynamic HTML" (DHTML) は、あるベンダーが、HTML、スタイルシート、及びドキュメントを活発にするスクリプトの組み合わせを表現するのに使われる一方言です。 W3C DOM ワーキンググループは、必ずや相互実行可能且つ言語的に中立なソリューションが合意に至るよう熱心に努めています(W3C FAQ も見てください)。Mozilla が "ウェブアプリケーションプラットフォーム" を標榜するならば、DOM のサポートは最も求められる機能の一つであり、もし Mozilla が他のブラウザの代替として成功したいのなら、欠かせないものです。

+

さらにより重要なことは、Mozilla (Firefox や Thunderbird も然り) のユーザインタフェースが XUL -- XML User interface Language でビルドされているという事実です。故に Mozilla は自身の UI を操作する為に DOM を使います。

diff --git a/files/ja/conflicting/web/api/document_object_model_656f0e51418b39c498011268be9b3a10/index.html b/files/ja/conflicting/web/api/document_object_model_656f0e51418b39c498011268be9b3a10/index.html new file mode 100644 index 0000000000..dcee4acf84 --- /dev/null +++ b/files/ja/conflicting/web/api/document_object_model_656f0e51418b39c498011268be9b3a10/index.html @@ -0,0 +1,37 @@ +--- +title: DOM developer guide +slug: Web/Guide/DOM +tags: + - API + - DOM + - Guide + - NeedsTranslation + - TopicStub +translation_of: Web/API/Document_Object_Model +translation_of_original: Web/Guide/API/DOM +--- +

{{draft}}

+ +

Document Object Model はHTML と XML ドキュメントのための API です。 DOM はドキュメントの構造的表現を提供しており、開発者がコンテンツ自身や、ドキュメントの表示を変更することができるようになります。基本的に、スクリプトやプログラミング言語を通して、ページを繋げています。

+ +

obuject（例、ドキュメントオブジェクトはドキュメント自身を表したり、テーブルオブジェクトはhtmlのテーブル要素を表す、など）内に組み込まれているウェブページを作成したり、操作するためのすべてのプロパティやメソッド、イベントはweb開発者が使用可能です。これらのオブジェクトにはjavascript等のスクリプト言語でアクセス可能です。

+ +

 

+ +

DOMはほぼ大抵 JavaScript と合わせて使用されます。しかし、DOMはどんなプログラミング言語にも非依存なものとして設計されました。 a single, consistent API を使用してドキュメントの構造的な表現を作ることが可能です。このサイトでは私たちはJavaScriptにフォーカスを当てていますが、DOMを実装するのはどのような言語でも可能です。

+ +

The DOM is most often used in conjunction with JavaScript. However, the DOM was designed to be independent of any particular programming language, making the structural representation of the document available from a single, consistent API. Though we focus on JavaScript throughout this site, implementations of the DOM can be built for any language.

+ +

The World Wide Web Consortium establishes a standard for the DOM, called the W3C DOM. It should, now that the most important browsers correctly implement it, enable powerful cross-browser applications.

+ +

DOMはなぜ重要なのか?

+ +

"Dynamic HTML" (DHTML) is a term used by some vendors to describe the combination of HTML, style sheets and scripts that allows documents to be animated. The W3C DOM Working Group is working hard to make sure interoperable and language-neutral solutions are agreed upon (see also the W3C FAQ).

+ +

As Mozilla claims the title of "Web Application Platform", support for the DOM is one of the most requested features, and a necessary one if Mozilla wants to be a viable alternative to the other browsers. The user interface of Mozilla (also Firefox and Thunderbird) is built using XUL, using the DOM to manipulate its own UI.

+ +

 

+ +

DOMについてもっと知る

+ +

{{LandingPageListSubpages}}

diff --git a/files/ja/conflicting/web/api/document_object_model_8435a25d5137b436d5d7161e1b813c02/index.html b/files/ja/conflicting/web/api/document_object_model_8435a25d5137b436d5d7161e1b813c02/index.html new file mode 100644 index 0000000000..4a390b9177 --- /dev/null +++ b/files/ja/conflicting/web/api/document_object_model_8435a25d5137b436d5d7161e1b813c02/index.html @@ -0,0 +1,52 @@ +--- +title: 序文 +slug: Web/API/Document_Object_Model/Preface +tags: + - DOM + - Gecko + - Gecko DOM Reference +translation_of: Web/API/Document_Object_Model +translation_of_original: Web/API/Document_Object_Model/Preface +--- +
+ {{ApiRef}}
+

この資料について

+

この節では、このガイドそのものについて説明します。誰のための資料で、どんな情報があって、あなた独自の DOM 開発を行うにあたってこの資料のなかの例をどのように使えるのか、について説明します。

+

この文書は書きかけなので、Gecko に実装されている DOM 関数と属性がきれいにまとめられてはいません。ただし、資料に含まれる各オブジェクトに関する文書 (DOM Document リファレンス など） は完結しています。多数の API に含まれるさまざまな資料が準備でき次第、この資料に追加します。

+

この資料の対象となる読者

+

Gecko DOM リファレンス の読者は web 開発者や web ページの仕組みを知っている web の利用者です。この資料では、読者の専門知識を前提とはしていません。DOM、XML、web サーバ、web 標準、読者が DOM にアクセスするための言語である JavaScript に関する知識があるとは限らないものとしています。ですが、web ページの基本である HTML とブラウザとスタイルシートなどは押さえているものとして書かれています。

+

「導入の記述がある」 「例が多様」 「説明が詳しい」 という点では、「初心者向け」 のハッキングガイドと言うこともできます。ただし、一般的に言って、技術資料というものは web 開発の経験があっても無くても、その人たちにとって有用な資料である必要があります。

+

Gecko とは？

+

Mozilla と Firefox、Netscape 6 以上、そのほかの Mozilla をもとにしたブラウザの DOM 実装は同一のものです。というのも、これらのブラウザは同じ技術を使用しているからです。naturally, it applies only to products based on the same version of Gecko, but it's tricky to explain

+

Gecko はこれらのブラウザの中にあるソフトウェアコンポーネントのことで、HTML の解析、ページのレイアウト、ドキュメント・オブジェクト・モデル、そしてアプリケーション・インタフェースの描画も処理しています。Gecko は、速く、標準に準拠した描画エンジンで、W3C の DOM 標準や DOM に類似した（しかし標準化されていない）ブラウザ・オブジェクト・モデル（例：window など）を、web ページやブラウザのアプリケーション・インタフェース（chrome）において、実装します。

+

ブラウザによって表示されるアプリケーション・インタフェースやコンテントは実際には異なりますが、DOM はこれらを一律にノードの階層として提示します。(commenting this incomplete sentence out for now...) The tree structure of the DOM (which in its application to the user

+

API 構文

+

各資料には、構文、入出力の引数 (return 型が与えられている return 型の場所) 、例、補足、該当仕様へのリンクがあります。

+

とくに読みとり専用属性の文法は基本的に一行だけです。なぜなら、それらのプロパティは設定できずアクセスしかできないからです。例えば、screen オブジェクトの availHeight は読取専用の属性なので、次のような構文で書かれています。

+
iAvail = window.screen.availHeight
+
+

つまり、式の右辺の属性だけが利用できるということです。それに対して、読み書き可能な属性の場合は、次の例でも分かるように、値を設定することもできます。

+
msg = window.status
+window.status = msg
+
+

一般に、メンバの記述があるオブジェクトの場合、その構文は簡潔な型になります。例えば、要素ならなんでも element ですし、document オブジェクトなら document ですし、TABLE オブジェクトなら TABLE といった具合です (データ型について詳しくは重要なデータ型 を参照してください)。

+

例の使い方

+

資料にある例のうち、その多くは単独のファイルとして完結しているものです。新しいファイルにコピーしてブラウザで開くと、きちんと動作します。コード断片もあります。断片の場合は、その断片を JavaScript コールバック関数内で使うことができます。例えば、 window.document 属性の資料にある例を次のように関数内に入れて、ボタンが押されたら呼ばれるような確認コードを書くことができます。

+
<!DOCTYPE html>
+<html>
+<head>
+<title>Test Page</title>
+<script>
+function testWinDoc() {
+  doc = window.document;
+  alert(doc.title);
+}
+</script>
+</head>
+
+<body>
+  <button onclick="testWinDoc();">test document property</button>
+</body>
+</html>
+
+

すぐに利用できるように梱包されていないオブジェクトのメンバーについても、上記のような関数やページを作り出すことができます。「テスト実行環境」 の導入部分にある DOM API のテスト の節を参照してください。それを使うと、一度に、たくさんの API の動作を確認できます。

diff --git a/files/ja/conflicting/web/api/documentorshadowroot/getselection/index.html b/files/ja/conflicting/web/api/documentorshadowroot/getselection/index.html new file mode 100644 index 0000000000..740d006c66 --- /dev/null +++ b/files/ja/conflicting/web/api/documentorshadowroot/getselection/index.html @@ -0,0 +1,13 @@ +--- +title: document.getSelection +slug: Web/API/Document/getSelection +tags: + - DOM + - Document + - Reference + - Selection +translation_of: Web/API/DocumentOrShadowRoot/getSelection +translation_of_original: Web/API/Document/getSelection +--- +

DOM の getSelection() メソッドは、 {{domxref("Window")}} インタフェース及び {{domxref("Document")}} インタフェースで利用可能です。
+ 詳細については {{domxref("window.getSelection()")}} の頁を参照して下さい。

diff --git a/files/ja/conflicting/web/api/documentorshadowroot/index.html b/files/ja/conflicting/web/api/documentorshadowroot/index.html new file mode 100644 index 0000000000..a7953136e6 --- /dev/null +++ b/files/ja/conflicting/web/api/documentorshadowroot/index.html @@ -0,0 +1,79 @@ +--- +title: DocumentOrShadowRoot.nodeFromPoint() +slug: Web/API/DocumentOrShadowRoot/nodeFromPoint +tags: + - API + - DocumentOrShadowRoot + - Method + - Non-standard + - Reference + - nodeFromPoint + - メソッド + - 標準外 +translation_of: Web/API/DocumentOrShadowRoot +translation_of_original: Web/API/DocumentOrShadowRoot/nodeFromPoint +--- +
{{APIRef("DOM")}}{{Non-standard_header}}
+ +

{{domxref("DocumentOrShadowRoot")}} インターフェイスの nodeFromPoint() プロパティは、 (ビューポートからの相対で) 指定された座標にある最上位のノードを返します。

+ +

現在のところ、このメソッドは Firefox でしか実装されておらず、クロムコードでのみ利用できます。

+ +

構文

+ +
var node = document.nodeFromPoint(x, y);
+ +

引数

+ +
+
x
+
点の水平座標を表す倍精度浮動小数値。
+
y
+
点の垂直座標を表す倍精度浮動小数値。
+
+ +

返値

+ +

{{domxref('Node')}} オブジェクト。

+ +

例

+ +

HTML Content

+ +
<div>
+  <p>Some text</p>
+</div>
+<p>Top node at point 30, 20:</p>
+<div id="output"></div>
+
+ +

JavaScript Content

+ +
var output = document.getElementById("output");
+if (document.nodeFromPoint) {
+  var node = document.nodeFromPoint(30, 20);
+    output.textContent += node.localName;
+} else {
+  output.innerHTML = "<span style=\"color: red;\">" +
+     "Browser does not support <code>document.nodeFromPoint()</code>" +
+     "</span>";
+}
+ +

{{EmbedLiveSample('Example', '420', '120')}}

+ +

仕様書

+ +

現在はどの仕様書にも含まれていません。

+ +

ブラウザーの対応

+ + + +

{{Compat("api.DocumentOrShadowRoot.nodeFromPoint")}}

+ +

関連情報

+ + diff --git a/files/ja/conflicting/web/api/documentorshadowroot_20ea0e1d91453a020aad3a16dbce16f1/index.html b/files/ja/conflicting/web/api/documentorshadowroot_20ea0e1d91453a020aad3a16dbce16f1/index.html new file mode 100644 index 0000000000..d3f79b8d11 --- /dev/null +++ b/files/ja/conflicting/web/api/documentorshadowroot_20ea0e1d91453a020aad3a16dbce16f1/index.html @@ -0,0 +1,83 @@ +--- +title: DocumentOrShadowRoot.nodesFromPoint() +slug: Web/API/DocumentOrShadowRoot/nodesFromPoint +tags: + - API + - DocumentOrShadowRoot + - Method + - Non-standard + - Reference + - nodesFromPoint + - メソッド +translation_of: Web/API/DocumentOrShadowRoot +translation_of_original: Web/API/DocumentOrShadowRoot/nodesFromPoint +--- +
{{APIRef("DOM")}}{{Non-standard_header}}
+ +

{{domxref("DocumentOrShadowRoot")}} インターフェイスの nodesFromPoint() プロパティは、 (ビューポートからの相対で) 指定された座標のすべてのノードの配列を返します。

+ +

現在のところ、このメソッドは Firefox でしか実装されておらず、クロムコードでのみ利用できます。

+ +

構文

+ +
var nodes = document.nodesFromPoint(x, y);
+ +

引数

+ +
+
x
+
点の水平座標。
+
y
+
点の垂直座標。
+
+ +

返値

+ +

{{domxref('Node')}} オブジェクトの配列。

+ +

例

+ +

HTML コンテンツ

+ +
<div>
+  <p>Some text</p>
+</div>
+<p>Nodes at point 30, 20:</p>
+<div id="output"></div>
+
+ +

JavaScript コンテンツ

+ +
var output = document.getElementById("output");
+if (document.nodesFromPoint) {
+  var nodes = document.nodesFromPoint(30, 20);
+  for(var i = 0; i < nodes.length; i++) {
+    output.textContent += nodes[i].localName;
+    if (i < nodes.length - 1) {
+      output.textContent += " < ";
+    }
+  }
+} else {
+  output.innerHTML = "<span style=\"color: red;\">" +
+     "Browser does not support <code>document.nodesFromPoint()</code>" +
+     "</span>";
+}
+ +

{{EmbedLiveSample('Example', '420', '120')}}

+ +

仕様書

+ +

現在はどの仕様書にも含まれていません。

+ +

ブラウザーの対応

+ + + +

{{Compat("api.DocumentOrShadowRoot.nodesFromPoint")}}

+ +

関連情報

+ + diff --git a/files/ja/conflicting/web/api/element/compositionstart_event/index.html b/files/ja/conflicting/web/api/element/compositionstart_event/index.html new file mode 100644 index 0000000000..e02e6c35ef --- /dev/null +++ b/files/ja/conflicting/web/api/element/compositionstart_event/index.html @@ -0,0 +1,80 @@ +--- +title: compositionstart +slug: Web/Events/compositionstart +tags: + - DOM + - Event + - Gecko DOM Reference + - events + - 要更新 +translation_of: Web/API/Element/compositionstart_event +translation_of_original: DOM/DOM_event_reference/compositionstart +--- +

DOM compositionstart イベントはユーザがIMEで未確定文字列の入力を開始した時のように、間接的なテキスト入力を開始した時に同期的に発生します。このイベントは {{ domxref("CompositionEvent") }} インターフェースを持ちます。

+
+ 注釈: このイベントはテキストが編集が始まる前に発生すべきではあるのですが、Gecko では編集を始めた直後に発生します。
+ +

仕様書

+

DOM Level3 Events

+

ブラウザ間の互換性

+

{{ CompatibilityTable() }}

+
+ + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本的なサポート +

{{ CompatVersionUnknown() }}

+

data 属性値は仕様と違っています。

+ 		{{ CompatGeckoDesktop("9.0") }} +

{{ CompatVersionUnknown() }}

+

data 属性値は常に空です。

+ 		{{ CompatNo() }}{{ CompatUnknown() }}
+
+
+ + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本的なサポート{{ CompatUnknown() }}{{ CompatGeckoMobile("9.0") }}{{ CompatUnknown() }}{{ CompatUnknown() }}{{ CompatUnknown() }}
+
+

Gecko の動作メモ

+

DOM Level 3 仕様書では compositionstart はキャンセル可能と定義されています。しかし、 Gecko では現在のところ、キャンセルをできないようにしています。

+

Gecko はこのイベントをIMEが編集を開始した時に発生させます。また、プラットフォームによっては開始された編集を取り消すAPIがありません。さらに、Gecko は IME が実際に編集を開始するまで各キーイベントがそのきっかけとなるかどうか知ることができません。これらの理由から、compositionstart イベントの {{ domxref("event.preventDefault()") }} は Gecko では機能しません。

diff --git a/files/ja/conflicting/web/api/element/index.html b/files/ja/conflicting/web/api/element/index.html new file mode 100644 index 0000000000..859be5e107 --- /dev/null +++ b/files/ja/conflicting/web/api/element/index.html @@ -0,0 +1,50 @@ +--- +title: Slotable +slug: Web/API/Slotable +tags: + - API + - Interface + - Reference + - Slotable + - Web Components + - shadow dom +translation_of: Web/API/Slottable +translation_of_original: Web/API/Slotable +--- +

{{APIRef("Shadow DOM")}}

+ +

Slotable mixin は、ノードを {{htmlelement("slot")}} 要素のコンテンツにする機能を定義します。— 次の機能が {{domxref("Element")}} と {{domxref("Text")}} の両方に含まれています。

+ +

プロパティ

+ +
+
{{domxref("Slotable.assignedSlot")}} {{readonlyInline}}
+
ノードが挿入されている {{htmlelement("slot")}} を返します。
+
+ +

メソッド

+ +

なし。

+ +

仕様

+ + + + + + + + + + + + + + +
仕様書策定状況コメント
{{SpecName('DOM WHATWG','#slotable','Slotable')}}{{Spec2('DOM WHATWG')}}初期定義
+ +

ブラウザー実装状況

+ + + +

{{Compat("api.Slotable")}}

diff --git a/files/ja/conflicting/web/api/formdata/using_formdata_objects/index.html b/files/ja/conflicting/web/api/formdata/using_formdata_objects/index.html new file mode 100644 index 0000000000..605885878f --- /dev/null +++ b/files/ja/conflicting/web/api/formdata/using_formdata_objects/index.html @@ -0,0 +1,145 @@ +--- +title: FormData オブジェクトの利用 +slug: Web/Guide/Using_FormData_Objects +tags: + - Advanced + - Example + - Forms + - Guide + - HTML + - Web +translation_of: Web/API/FormData/Using_FormData_Objects +translation_of_original: Web/Guide/Using_FormData_Objects +--- +

FormData オブジェクトは、XMLHttpRequest を使用して送信するためのキーと値のペアのセットを収集可能にします。本来はフォームデータの送信に使用することを想定していましたが、キーのついたデータを伝送するためにフォームとは独立して使用することもできます。伝送されるデータは、フォームのエンコードタイプが multipart/form-data に設定されている場合に、{{domxref("HTMLFormElement.submit","submit()")}} メソッドで送信する際に使用するデータと同じ形式です。

+ +

スクラッチから FormData オブジェクトを作成する

+ +

以下のように FormData オブジェクトはあなた自身で作成でき、インスタンス化したら {{domxref("FormData.append","append()")}} メソッドを呼び出すことでフィールドに付加します:

+ +
var formData = new FormData();
+
+formData.append("username", "Groucho");
+formData.append("accountnum", 123456); // 数値 123456 は直ちに文字列 "123456" へ変換されます
+
+// HTML の file input でユーザが選択したファイル
+formData.append("userfile", fileInputElement.files[0]);
+
+// ファイルのような JavaScript オブジェクト
+var content = '<a id="a"><b id="b">hey!</b></a>'; // 新しいファイルのボディ...
+var blob = new Blob([content], { type: "text/xml"});
+
+formData.append("webmasterfile", blob);
+
+var request = new XMLHttpRequest();
+request.open("POST", "http://foo.com/submitform.php");
+request.send(formData);
+
+ +
注記: フィールド "userfile" および "webmasterfile" はどちらも、ファイルを含んでいます。フィールド "accountnum" に与えた数値は FormData.append() メソッドにより直ちに文字列へ変換されます (フィールドの値として {{domxref("Blob")}}、{{domxref("File")}}、または文字列をとることができます: 値が Blob でもファイルでもない場合は、文字列に変換されます)。
+ +

このサンプルでは "username"、"accountnum"、"userfile"、"webmasterfile" という名前のフィールドの値を持つ FormData のインスタンスを作成しており、またフォームのデータを送信するために XMLHttpRequest の send() メソッドを使用しています。フィールド "webmasterfile" は {{domxref("Blob")}} です。Blob オブジェクトはファイルに似たオブジェクトで、イミュータブルな生デーです。Blob は必ずしも JavaScript ネイティブ形式のデータを表すとは限りません。{{domxref("File")}} インターフェイスは Blob を基にしており、blob の機能性を継承しつつユーザのシステムにあるファイル向けのサポートを拡張しています。Blob を作成するために、{{domxref("Blob.Blob","Blob()")}} コンストラクタを呼び出すことができます。

+ +

HTML フォームから FormData オブジェクトを取り出す

+ +

既存の {{HTMLElement("form")}} のデータを含む FormData オブジェクトを構築するために、FormData オブジェクトを作成する際にその form 要素を指定します:

+ +
var formData = new FormData(someFormElement);
+
+ +

例:

+ +
var formElement = document.querySelector("form");
+var request = new XMLHttpRequest();
+request.open("POST", "submitform.php");
+request.send(new FormData(formElement));
+
+ +

以下のように、FormData オブジェクトをフォームより取得してから送信するまでの間に、追加のデータを付加することもできます:

+ +
var formElement = document.querySelector("form");
+var formData = new FormData(formElement);
+var request = new XMLHttpRequest();
+request.open("POST", "submitform.php");
+formData.append("serialnumber", serialNumber++);
+request.send(formData);
+ +

これにより、必ずしもユーザが編集可能である必要がない追加情報を含めるために、送信前にフォームデータを拡張することができます。

+ +

FormData オブジェクトを使用してファイルを送信する

+ +

FormData を使用してファイルを送信することもできます。type が "file" である {{HTMLElement("input")}} 要素を、{{htmlelement("form")}} に含めます:

+ +
<form enctype="multipart/form-data" method="post" name="fileinfo">
+  <label>Your email address:</label>
+  <input type="email" autocomplete="on" autofocus name="userid" placeholder="email" required size="32" maxlength="64" /><br />
+  <label>Custom file label:</label>
+  <input type="text" name="filelabel" size="12" maxlength="32" /><br />
+  <label>File to stash:</label>
+  <input type="file" name="file" required />
+  <input type="submit" value="Stash the file!" />
+</form>
+<div></div>
+
+ +

そして、以下のようなコードを使用して送信できます:

+ +
var form = document.forms.namedItem("fileinfo");
+form.addEventListener('submit', function(ev) {
+
+  var oOutput = document.querySelector("div"),
+      oData = new FormData(form);
+
+  oData.append("CustomField", "This is some extra data");
+
+  var oReq = new XMLHttpRequest();
+  oReq.open("POST", "stash.php", true);
+  oReq.onload = function(oEvent) {
+    if (oReq.status == 200) {
+      oOutput.innerHTML = "Uploaded!";
+    } else {
+      oOutput.innerHTML = "Error " + oReq.status + " occurred when trying to upload your file.<br \/>";
+    }
+  };
+
+  oReq.send(oData);
+  ev.preventDefault();
+}, false);
+
+ +
+

注記: フォームへの参照を渡した場合は、open() の呼び出しで指定したメソッドよりもフォームで指定したメソッドを優先します。

+
+ +

以下のように、{{domxref("FormData")}} オブジェクトへ直接 {{domxref("File")}} や {{domxref("Blob")}} を追加することもできます:

+ +
data.append("myfile", myBlob, "filename.txt");
+
+ +

{{domxref("FormData.append","append()")}} メソッドを使用する際は省略可能な第 3 引数を使用して、Content-Disposition ヘッダに含めるファイル名を渡すことができます。これはサーバへ送信されます。ファイル名を指定しない (あるいは引数がサポートされない) 場合は、"blob" という名前を使用します。

+ +

正しいオプションを設定することで、jQuery と共に FormData を使用することもできます:

+ +
var fd = new FormData(document.querySelector("form"));
+fd.append("CustomField", "This is some extra data");
+$.ajax({
+  url: "stash.php",
+  type: "POST",
+  data: fd,
+  processData: false,  // jQuery がデータを処理しないよう指定
+  contentType: false   // jQuery が contentType を設定しないよう指定
+});
+
+ +

FormData オブジェクトを使用せずに AJAX でフォームやファイルを送信する

+ +

FormData オブジェクトを使用せずに、AJAX でシリアライズや送信する方法を知りたい場合は、 こちらの節をご覧ください。

+ +

関連情報

+ + diff --git a/files/ja/conflicting/web/api/globaleventhandlers/onclick/index.html b/files/ja/conflicting/web/api/globaleventhandlers/onclick/index.html new file mode 100644 index 0000000000..ac36968fa6 --- /dev/null +++ b/files/ja/conflicting/web/api/globaleventhandlers/onclick/index.html @@ -0,0 +1,45 @@ +--- +title: window.onclick +slug: Web/API/Window/onclick +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/GlobalEventHandlers/onclick +translation_of_original: Web/API/Window/onclick +--- +
+ {{ApiRef}}
+

概要

+

カーソルがウィンドウ内にある時にユーザがマウスボタンをクリックした場合に呼び出されます。このイベントはどのマウスボタンを押下した場合でも発生します。イベントが発生した地点はイベントのプロパティから取得する事が出来ます。

+

構文

+
window.onclick =funcRef;
+
+ +

例

+
<!DOCTYPE html>
+<html>
+<head>
+<meta charset="UTF-8" />
+<title>onclick のテスト</title>
+<script>
+function clickPage () {
+  alert("click event detected!");
+}
+
+window.onclick = clickPage;
+</script>
+</head>
+
+<body>
+
+<p>このページ上でマウスボタンをクリックしてみてください。</p>
+
+</body>
+</html>
+

ユーザが Window 内をクリックすると click イベントが発生します。

+

仕様

+

どの仕様書にも含まれていません。

diff --git a/files/ja/conflicting/web/api/globaleventhandlers/onmousedown/index.html b/files/ja/conflicting/web/api/globaleventhandlers/onmousedown/index.html new file mode 100644 index 0000000000..b5f947f8be --- /dev/null +++ b/files/ja/conflicting/web/api/globaleventhandlers/onmousedown/index.html @@ -0,0 +1,48 @@ +--- +title: window.onmousedown +slug: Web/API/Window/onmousedown +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/GlobalEventHandlers/onmousedown +translation_of_original: Web/API/Window/onmousedown +--- +
+ {{ApiRef}}
+

概要

+

{{domxref("window")}} 上での mousedown イベントに対応するイベントハンドラです。

+

構文

+
window.onmousedown = funcRef;
+
+ +

例

+
window.onmousedown = doFunc;
+
+
<!DOCTYPE html>
+<html lang="ja">
+<head>
+<meta charset="UTF-8" />
+<title>onmousedown のテスト</title>
+
+<script>
+window.onmousedown = mousedown;
+
+function mousedown() {
+  alert("mousedown イベントが発生しました。");
+}
+</script>
+
+</head>
+<body>
+<p>ページ上でのマウスクリック（右クリック、左クリック、中ボタン）で  mousedown イベントが発生します。</p>
+</body>
+</html>
+
+

注記

+

ページ上の任意の場所でマウスボタンをクリックすると mousedown イベントが発生し、アラートを表示する関数が呼び出されます。

+

仕様

+

標準仕様書には含まれていません。

diff --git a/files/ja/conflicting/web/api/globaleventhandlers/onmouseup/index.html b/files/ja/conflicting/web/api/globaleventhandlers/onmouseup/index.html new file mode 100644 index 0000000000..f7133126a9 --- /dev/null +++ b/files/ja/conflicting/web/api/globaleventhandlers/onmouseup/index.html @@ -0,0 +1,57 @@ +--- +title: window.onmouseup +slug: Web/API/Window/onmouseup +tags: + - DOM + - Gecko + - Gecko DOM Reference + - Window +translation_of: Web/API/GlobalEventHandlers/onmouseup +translation_of_original: Web/API/Window/onmouseup +--- +
+ {{ApiRef}}
+

概要

+

{{domxref("window")}} 上の mouseup イベントに対応するイベントハンドラです。

+

構文

+
window.onmouseup = funcRef;
+
+ +

例

+
function doFunc() {
+  alert("こんにちは！");
+}
+
+window.onmouseup = doFunc;
+
+
window.onmouseup = function() {
+  alert("こんばんは！");
+};
+
+
<!DOCTYPE html>
+<html lang="ja">
+<head>
+<meta charset="UTF-8" />
+<title>onmouseup のテスト</title>
+
+<script>
+window.onmouseup = mouseup;
+
+function mouseup() {
+  alert("mouseup イベントを検出!");
+}
+</script>
+
+</head>
+<body>
+<p>ページ上をマウスのボタンでクリックし、数秒押し続け、ボタンを放します。
+マウスのボタンを放すことで、 mouseup イベントが発生します。</p>
+</body>
+</html>
+
+

注記

+

mouseup イベントは、ドキュメント内のどこででも、ユーザがマウスの左ボタンを放すことによって発生します。

+

仕様

+

標準仕様書には含まれていません。

diff --git a/files/ja/conflicting/web/api/html_drag_and_drop_api/index.html b/files/ja/conflicting/web/api/html_drag_and_drop_api/index.html new file mode 100644 index 0000000000..6b9a4be242 --- /dev/null +++ b/files/ja/conflicting/web/api/html_drag_and_drop_api/index.html @@ -0,0 +1,9 @@ +--- +title: DragDrop +slug: DragDrop +--- +

 

+ +

This page was auto-generated because a user created a sub-page to this page.

+ +

 

diff --git a/files/ja/conflicting/web/api/index.html b/files/ja/conflicting/web/api/index.html new file mode 100644 index 0000000000..e069431e6e --- /dev/null +++ b/files/ja/conflicting/web/api/index.html @@ -0,0 +1,58 @@ +--- +title: element.name +slug: Web/API/Element/name +translation_of: Web/API +translation_of_original: Web/API/Element/name +--- +

{{ ApiRef() }}

+

概要

+

name はDOM オブジェクトのname 属性を取得または設定します。

+

ただし、この属性が適用されるのは次の要素に限られます。

+

{{ HTMLelement("a") }}, {{ HTMLelement("applet") }}, {{ HTMLelement("form") }}, {{ HTMLelement("frame") }}, {{ HTMLelement("iframe") }}, {{ HTMLelement("img") }}, {{ HTMLelement("input") }}, {{ HTMLelement("map") }}, {{ HTMLelement("meta") }}, {{ HTMLelement("object") }}, {{ HTMLelement("option") }}, {{ HTMLelement("param") }}, {{ HTMLelement("select") }}, {{ HTMLelement("textarea") }}.

+

name は、 {{ domxref("document.getElementsByName()") }} メソッドか、 form と form.elements のコレクションで使用することができます。 form や form.elements のコレクションで使われた場合、一つの要素かコレクションを返します。

+

構文

+
HTMLElement.name = string;
+var elName = HTMLElement.name;
+
+var fControl = HTMLFormElement.elementName;
+var controlCollection = HTMLFormElement.elements.elementName;
+
+

例

+
<form action="" name="formA">
+  <input type="text" value="foo">
+</form>
+
+<script type="text/javascript">
+
+  // form の最初の要素の参照を取得します。
+  var formElement = document.forms['formA'].elements[0];
+
+  // name 属性を設定します。
+  formElement.name = 'inputA';
+
+  // input の value を表示します。
+  alert(document.forms['formA'].elements['inputA'].value);
+
+</script>
+
+

注記

+

Internet Explorer (IE)では、 {{ domxref("document.createElement()") }}を使って作成されたDOM オブジェクトの name 属性 は、設定および変更をすることができません。

+

仕様

+

W3C DOM 2 HTML Specification:

+ +

{{ languages( { "en" :"en/DOM/element.name", "fr": "fr/DOM/element.name", "pl": "pl/DOM/element.name" } ) }}

diff --git a/files/ja/conflicting/web/api/mediastream_recording_api/index.html b/files/ja/conflicting/web/api/mediastream_recording_api/index.html new file mode 100644 index 0000000000..a2e3ec8eaf --- /dev/null +++ b/files/ja/conflicting/web/api/mediastream_recording_api/index.html @@ -0,0 +1,187 @@ +--- +title: MediaRecorder API +slug: Web/API/MediaRecorder_API +translation_of: Web/API/MediaStream_Recording_API +translation_of_original: Web/API/MediaRecorder_API +--- +
+

MediaRecorder API (MediaStream Recording) はインプットデバイスからのメディアストリームを記録するための API です。記録したストリームは PCM データのエンコードと言った操作をせずに利用できます。 {{ domxref("Navigator.getUserMedia()") }} を単体で利用する際の利用が想定されています。

+
+ +

キーコンセプトと利用例

+ +

MediaRecorder を {{ domxref("Navigator.getUserMedia()") }} とともに利用することで、メディアデータを記録できます。単純には、 {{ domxref("MediaRecorder.start()") }} メソッドを呼ぶことで記録を開始できます。MediaStream の終了、もしくは {{ domxref("MediaRecorder.stop()") }} や{{ domxref("MediaRecorder.requestData()") }} の呼び出しによって記録用のデータが準備できた際には、dataavailable イベントが発生します。現在のところ、データはプラットホームの標準でエンコードされ、 dataavailableの data 属性に {{ domxref("Blob") }} として配置されます。

+ +

アプリは利用可能なエンコード方式を問い合わせ、その中から利用するものを選択することも可能です。またデータをより小さなバッファとして一定間隔で受け取ることもできます。間隔は {{ domxref("MediaRecorder.start()") }} を呼ぶ際に指定できます。

+ +
+

注意: MediaRecorder API の基本的な利用方法については MediaRecorder API の利用  をご覧ください。

+
+ +

MediaRecorder インタフェース

+ +
+
{{ domxref("MediaRecorder") }}
+
MediaRecorder API を利用してメディアデータを記録するために必要な機能を保持するオブジェクト。 MediaRecorder() コンストラクタによって作成される。
+
{{ domxref("BlobEvent") }}
+
{{ domxref("MediaRecorder") }} によって記録されたメディアデータを保持する {{ domxref("Blob") }} オブジェクトへのアクセス手段を提供する。
+
+ +

例

+ +
if (navigator.getUserMedia) {
+   console.log('getUserMedia supported.');
+   navigator.getUserMedia (
+      // constraints - only audio needed for this app
+      {
+         audio: true
+      },
+
+      // Success callback
+      function(stream) {
+           var mediaRecorder = new MediaRecorder(stream);
+
+           record.onclick = function() {
+               mediaRecorder.start();
+               console.log("recorder started");
+           }
+
+           stop.onclick = function() {
+               mediaRecorder.stop();
+               console.log("recorder stopped");
+           }
+
+           mediaRecorder.ondataavailable = function(e) {
+             console.log("data available after MediaRecorder.stop() called.");
+
+             var audio = document.createElement('audio');
+             audio.setAttribute('controls', '');
+             var audioURL = window.URL.createObjectURL(e.data);
+             audio.src = audioURL;
+           }
+      },
+
+      // Error callback
+      function(err) {
+         console.log('The following gUM error occured: ' + err);
+      }
+   );
+} else {
+   console.log('getUserMedia not supported on your browser!');
+}
+ +
+

注意: このサンプルコードはWeb Dictaphoneのデモを参考にしています。コードを簡単にする為にいくつかの行は省略されています。完全なコードは 元ソース を参照して下さい。

+
+ +

ブラウザ互換性

+ +

{{ CompatibilityTable() }}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support +

{{ CompatChrome(47.0) }}

+ 		{{ CompatGeckoDesktop("25.0") }}{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OSIE PhoneOpera MobileSafari Mobile
Basic support{{ CompatChrome(47.0) }}{{ CompatGeckoDesktop("25.0") }}1.3{{ CompatNo() }}{{ CompatNo() }}{{ CompatNo() }}
+
+ +

[1] The initial Firefox OS implementation only supported audio recording.

+ +

[2] To use {{domxref("MediaRecorder")}} in Chrome 47 and 48, enable experimental Web Platform features from the chrome://flags page.

+ +

[3] Audio recording works in Chrome 49 and above; Chrome 47 and 48 only support video recording.

+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('MediaStream Recording', '#MediaRecorderAPI')}}{{Spec2('MediaStream Recording')}}
+ +

関連項目

+ + + + diff --git a/files/ja/conflicting/web/api/mouseevent/button/index.html b/files/ja/conflicting/web/api/mouseevent/button/index.html new file mode 100644 index 0000000000..572f611ebc --- /dev/null +++ b/files/ja/conflicting/web/api/mouseevent/button/index.html @@ -0,0 +1,60 @@ +--- +title: event.button +slug: Web/API/Event/button +tags: + - DOM + - Gecko + - Gecko DOM Reference +translation_of: Web/API/MouseEvent/button +translation_of_original: Web/API/event.button +--- +

{{ ApiRef() }}

+

Summary

+

イベントを発生させたマウスのボタンを示しています。

+

Syntax

+
var buttonCode = event.button;
+
+

state を変えたボタンを示す整数値を返します。

+ +

ボタンの順序はどのようにポインティングデバイスが設定されているかによります。

+

Example

+
<script type="text/javascript">
+
+function whichButton(e)
+{
+  // Handle different event models
+  var e = e || window.event;
+  var btnCode;
+
+  if ('object' == typeof e){
+    btnCode = e.button;
+
+    switch (btnCode){
+      case 0  : alert('Left button clicked');
+                break;
+      case 1  : alert('Middle button clicked');
+                break;
+      case 2  : alert('Right button clicked');
+                break;
+      default : alert('Unexpected code: ' + btnCode);
+    }
+  }
+}
+
+</script>
+
+<p onclick="whichButton(event);">Click with mouse...</p>
+
+
+

Notes

+

マウスのクリックはしばしばUIによって横取りされるため、ある状況では普通のクリック（通常は左クリック）でないマウスのクリックを検出することが普通のクリックよりも難しいかもしれません。

+

ユーザーはポインティングデバイスのボタンの設定を変更する可能性があり、たといこのイベントの button プロパティが 0 であったとしても、それは物理的にポインティングデバイスの最も左に存在するボタンによるものではないかもしれません。しかし、そんな場合にも、標準的なボタン配置における左クリックと同様の動作をするべきであるとされています。

+

Specification

+

DOM 2 Events Specification: button

+
+  
+

{{ languages( { "en": "en/DOM/event.button", "pl": "pl/DOM/event.button" } ) }}

diff --git a/files/ja/conflicting/web/api/navigator/index.html b/files/ja/conflicting/web/api/navigator/index.html new file mode 100644 index 0000000000..141fc19189 --- /dev/null +++ b/files/ja/conflicting/web/api/navigator/index.html @@ -0,0 +1,620 @@ +--- +title: navigator +slug: DOM_Client_Object_Cross-Reference/navigator +translation_of: Web/API/Navigator +translation_of_original: DOM_Client_Object_Cross-Reference/navigator +--- +

+

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ユーザエージェントプロパティ読み取り専用データ型デフォルト値
Gecko-1.0.1appCodeNametruestringMozilla
Gecko-1.4appCodeNametruestringMozilla
Gecko-1.7.8appCodeNametruestringMozilla
IE-6.0appCodeNametruestringMozilla
Opera-8.0appCodeNamefalsestringMozilla
IE-6.0appMinorVersiontruestring{{ mediawiki.external('hotfixes installed') }}
Opera-8.0appMinorVersionfalsestring +
Gecko-1.0.1appNametruestringNetscape
Gecko-1.4appNametruestringNetscape
Gecko-1.7.8appNametruestringNetscape
IE-6.0appNametruestringMicrosoft Internet Explorer
Opera-8.0appNamefalsestringMicrosoft Internet Explorer
Gecko-1.0.1appVersiontruestringdepends on Operating System
Gecko-1.4appVersiontruestring5.0 ({{ mediawiki.external('platform') }}; {{ mediawiki.external('language') }};)
Gecko-1.7.8appVersiontruestring5.0 ({{ mediawiki.external('platform') }}; {{ mediawiki.external('language') }})
IE-6.0appVersiontruestring4.0 (compatible; MSIE 6.0; ...)
Opera-8.0appVersionfalsestring4.0 (compatible; MSIE 6.0; {{ mediawiki.external('platform') }}; {{ mediawiki.external('language') }})
IE-6.0browserLanguagetruestring{{ mediawiki.external('depends on language') }}
Opera-8.0browserLanguagefalsestringen
Gecko-1.0.1cookieEnabledtruebooleantrue
Gecko-1.4cookieEnabledtruebooleantrue
Gecko-1.7.8cookieEnabledtruebooleanfalse
IE-6.0cookieEnabledtruebooleantrue
Opera-8.0cookieEnabledfalsebooleantrue
IE-6.0cpuClasstruestringdepends on CPU
Gecko-1.0.1javaEnabledtruefunction +
Gecko-1.4javaEnabledtruefunction +
Gecko-1.7.8javaEnabledtruefunction +
IE-6.0javaEnabledtruefunction +
Opera-8.0javaEnabledtruefunction +
Gecko-1.0.1languagetruestringdepends on default language
Gecko-1.4languagetruestringen-US
Gecko-1.7.8languagetruestringen-US
Opera-8.0languagefalsestringen
Gecko-1.0.1mimeTypestrueobject{{ mediawiki.external('object MimeTypeArray') }}
Gecko-1.4mimeTypestrueobject{{ mediawiki.external('object MimeTypeArray') }}
Gecko-1.7.8mimeTypestrueobject{{ mediawiki.external('object MimeTypeArray') }}
IE-6.0mimeTypestrueobject +
Opera-8.0mimeTypesfalseobject{{ mediawiki.external('object MimeTypes') }}
IE-6.0onLinetruebooleantrue
IE-6.0opsProfiletrueobject +
Gecko-1.0.1oscputruestringdepends on Operating System
Gecko-1.4oscputruestring +
Gecko-1.7.8oscputruestring{{ mediawiki.external('depends on Operating System') }}
Gecko-1.0.1platformtruestringdepends on Operating System
Gecko-1.4platformtruestring +
Gecko-1.7.8platformtruestring{{ mediawiki.external('depends on Operating System') }}
IE-6.0platformtruestringdepends on Operating System
Opera-8.0platformfalsestring{{ mediawiki.external('depends on Operating System') }}
Gecko-1.0.1pluginstrueobject{{ mediawiki.external('object PluginArray') }}
Gecko-1.4pluginstrueobject{{ mediawiki.external('object PluginArray') }}
Gecko-1.7.8pluginstrueobject{{ mediawiki.external('object PluginArray') }}
IE-6.0pluginstrueobject +
Opera-8.0pluginsfalseobject{{ mediawiki.external('object PluginArray') }}
Gecko-1.0.1preferencetruefunction +
Gecko-1.4preferencetruefunction +
Gecko-1.7.8preferencetruefunction +
Gecko-1.0.1producttruestringGecko
Gecko-1.4producttruestringGecko
Gecko-1.7.8producttruestringGecko
Gecko-1.0.1productSubtruestringCCYYMMDD - build date
Gecko-1.4productSubtruestringCCYYMMDD
Gecko-1.7.8productSubtruestring20050511
Gecko-1.0.1securityPolicytruestring +
Gecko-1.4securityPolicytruestring +
Gecko-1.7.8securityPolicytruestring +
IE-6.0systemLanguagetruestringdepends on default langauge
Gecko-1.0.1taintEnabledtruefunction +
Gecko-1.4taintEnabledtruefunction +
Gecko-1.7.8taintEnabledtruefunctionfalse {{ Obsolete_inline() }}
IE-6.0taintEnabledtruefunction +
Opera-8.0taintEnabledtruefunction +
Gecko-1.0.1userAgenttruestringMozilla/5.0 (...; rv:1.0.1) Gecko/CCYYMMDD Vendor/version
Gecko-1.4userAgenttruestringMozilla/5.0 (...; rv:1.4) Gecko/20030624
Gecko-1.7.8userAgenttruestringMozilla/5.0 (...; rv:1.7.8) Gecko/20050511
IE-6.0userAgenttruestringMozilla/4.0 (compatible; MSIE 6.0; ...)
Opera-8.0userAgentfalsestringMozilla/4.0 (compatible; MSIE 6.0; ...) Opera 8.0
IE-6.0userLanguagetruestringdepends on default langauge
Opera-8.0userLanguagefalsestringen
IE-6.0userProfiletrueobject +
Gecko-1.0.1vendortruestringempty if Mozilla, otherwise matches Vendor in userAgent
Gecko-1.4vendortruestring +
Gecko-1.7.8vendortruestring +
Gecko-1.0.1vendorSubtruestringempty if Mozilla, otherwise matches version in userAgent
Gecko-1.4vendorSubtruestring +
Gecko-1.7.8vendorSubtruestring +
+{{ languages( { "en": "en/DOM_Client_Object_Cross-Reference/navigator" } ) }} diff --git a/files/ja/conflicting/web/api/node/index.html b/files/ja/conflicting/web/api/node/index.html new file mode 100644 index 0000000000..1de7600c48 --- /dev/null +++ b/files/ja/conflicting/web/api/node/index.html @@ -0,0 +1,33 @@ +--- +title: Node.baseURIObject +slug: Web/API/Node/baseURIObject +tags: + - DOM + - DOM 3 + - Gecko + - Node +translation_of: Web/API/Node +translation_of_original: Web/API/Node/baseURIObject +--- +
{{ApiRef}} {{Fx_minversion_header("3")}} {{Non-standard_header}}
+ +

概要

+ +

baseURIObject は、文書の基底 URL (base URL) を示す {{Interface("nsIURI")}} オブジェクトを返します。

+ +

このプロパティは、HTML 、 XUL、 SVG、 MathML 等のノード全てに存在します。但し、このプロパティの使用を試みるスクリプトが UniversalXPConnect 特権を持つ場合に限ります。

+ +

基底 URL の詳細については {{domxref("Node.baseURI")}} の頁をご覧下さい。

+ +

構文

+ +
uriObj = element.baseURIObject
+
+ +

注記

+ +

このプロパティは読取専用です。書込を試みた場合、例外がスローされます。また、このプロパティには、特権を持つコードからのみアクセス可能です。

+ +

仕様書

+ +

標準仕様書には含まれません。

diff --git a/files/ja/conflicting/web/api/node_378aed5ed6869e50853edbc988cf9556/index.html b/files/ja/conflicting/web/api/node_378aed5ed6869e50853edbc988cf9556/index.html new file mode 100644 index 0000000000..41547615f2 --- /dev/null +++ b/files/ja/conflicting/web/api/node_378aed5ed6869e50853edbc988cf9556/index.html @@ -0,0 +1,21 @@ +--- +title: Node.nodePrincipal +slug: Web/API/Node/nodePrincipal +tags: + - DOM + - Gecko + - Gecko DOM Reference +translation_of: Web/API/Node +translation_of_original: Web/API/Node/nodePrincipal +--- +
+ {{ApiRef}}{{Fx_minversion_header("3")}}{{Non-standard_header}}
+

概要

+

nodePrincipal は、ノードの現在のセキュリティ・コンテキストを表す {{interface("nsIPrincipal")}} オブジェクトを返します

+

{{note("このプロパティは、HTML 、XUL 、SVG 、MathML などの全てのノードに存在しますが、スクリプトが使用を試みた場合にのみ、 UniversalXPConnect 特権を持ちます。")}}

+

構文

+
principalObj = element.nodePrincipal
+

注記

+

このプロパティは読取専用です。書込みを試みた場合、例外がスローされます。また、このプロパティには特権コードからのみアクセス可能です。

+

仕様書

+

仕様書はありません。

diff --git a/files/ja/conflicting/web/api/url/index.html b/files/ja/conflicting/web/api/url/index.html new file mode 100644 index 0000000000..ac758d1b3b --- /dev/null +++ b/files/ja/conflicting/web/api/url/index.html @@ -0,0 +1,101 @@ +--- +title: window.URL +slug: Web/API/Window/URL +tags: + - API + - DOM + - Property + - Reference + - Window +translation_of: Web/API/URL +translation_of_original: Web/API/Window/URL +--- +

{{ApiRef("Window")}}{{SeeCompatTable}}

+ +

Window.URL プロパティは、オブジェクト URL の作成や操作に用いる静的なメソッドを提供します。

+ +

{{AvailableInWorkers}}

+ +

構文

+ +

静的なメソッドの呼び出し:

+ +
img.src = URL.{{domxref("URL.createObjectURL", "createObjectURL")}}(blob);
+ +

新しいオブジェクトの構築:

+ +
var url = new {{domxref("URL.URL", "URL")}}("../cats/", "https://www.example.com/dogs/");
+ +

仕様

+ + + + + + + + + + + + + + +
仕様ステータスコメント
{{SpecName('URL', '#dom-url', 'URL')}}{{Spec2('URL')}}初期定義。
+ +

ブラウザー実装状況

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
機能ChromeFirefox (Gecko)Internet ExplorerOperaSafari
基本サポート8.0[2]{{CompatGeckoDesktop("2.0")}}[1]
+ {{CompatGeckoDesktop("19.0")}}		10.015.0[2]6.0[2]
+ 7.0
+
+ +
+ + + + + + + + + + + + + + + + + + + +
機能AndroidFirefox Mobile (Gecko)IE MobileOpera MobileSafari Mobile
基本サポート{{CompatVersionUnknown}}[2]{{CompatGeckoMobile("14.0")}}[1]
+ {{CompatGeckoMobile("19.0")}}		{{CompatVersionUnknown}}15.0[2]6.0[2]
+
+ +

[1] Gecko 2 (Firefox 4) から Gecko 18 まで、Gecko は非標準の nsIDOMMozURLProperty 内部型を返していました。 実際には、何の違いもありません。

+ +

[2] 非標準の webkitURL という名前で実装されています。

diff --git a/files/ja/conflicting/web/api/web_storage_api/index.html b/files/ja/conflicting/web/api/web_storage_api/index.html new file mode 100644 index 0000000000..72c9a903e3 --- /dev/null +++ b/files/ja/conflicting/web/api/web_storage_api/index.html @@ -0,0 +1,14 @@ +--- +title: DOM Storage +slug: DOM/Storage +tags: + - DOM + - Gecko + - HTML5 + - JavaScript + - Offline web applications + - 要更新 +translation_of: Web/API/Web_Storage_API +translation_of_original: Web/Guide/API/DOM/Storage +--- +

REDIRECT Web Storage API

diff --git a/files/ja/conflicting/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html b/files/ja/conflicting/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html new file mode 100644 index 0000000000..15dcbf30e3 --- /dev/null +++ b/files/ja/conflicting/web/api/webgl_api/tutorial/using_textures_in_webgl/index.html @@ -0,0 +1,16 @@ +--- +title: Cross-Domain Textures +slug: Web/API/WebGL_API/Cross-Domain_Textures +translation_of: Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL#Cross-domain_textures +translation_of_original: Web/API/WebGL_API/Cross-Domain_Textures +--- +

WebGL のテクスチャの読み込みは、クロスドメインアクセス制御に従います。コンテンツで他のドメインからテクスチャを読み込むためには、CORS で許可を得る必要があります。CORS について詳しくは、HTTP access control をご覧ください。

+

CORS で許可された画像を WebGL のテクスチャとして使用する方法の説明を こちらの hacks.mozilla.org の記事 に掲載していますので、サンプル と合わせてご覧ください。

+

{{ gecko_callout_heading("8.0") }}

WebGL テクスチャ向けの CORS サポートと、画像要素の crossOrigin 属性が Gecko 8 {{ geckoRelease("8.0") }} で実装されました。

+
+

汚染された (書き込みのみ) 2D canvas を WebGL のテクスチャとして使用することはできません。2D {{ HTMLElement("canvas") }} が汚染されたとは例えば、クロスドメインの画像が canvas 上に描画された状態を指します。

+

{{ gecko_callout_heading("9.0") }}

Canvas 2D drawImage 向けの CORS サポートが Gecko 9 {{ geckoRelease("9.0") }} で実装されました。これは、CORS で許可されたクロスドメインの画像が 2D canvas を汚染しないので、2D canvas を WebGL のテクスチャ素材として使用することが可能であり続けることを意味します。

+
+

{{ gecko_callout_heading("12.0") }}

クロスドメインの動画に対する CORS サポートと、{{ HTMLElement("video") }} 要素のcrossorigin 属性を Gecko 12 {{ geckoRelease("12.0") }} で実装しました。

+
+

{{ languages( { "en": "en/WebGL/Cross-Domain_Textures"} ) }}

diff --git a/files/ja/conflicting/web/api/websockets_api/index.html b/files/ja/conflicting/web/api/websockets_api/index.html new file mode 100644 index 0000000000..d924ac2328 --- /dev/null +++ b/files/ja/conflicting/web/api/websockets_api/index.html @@ -0,0 +1,23 @@ +--- +title: WebSockets リファレンス +slug: Web/API/WebSockets_API/WebSockets_reference +tags: + - WebSocket + - WebSockets +translation_of: Web/API/WebSockets_API +translation_of_original: Web/API/WebSockets_API/WebSockets_reference +--- +
{{draft}}
+

以下のページは、WebSocket API のインタフェースに関する文書です。

+ + +
+
WebSocket
+
WebSocket のサーバに接続し、その接続上でデータを送受信するためのプライマリインターフェイス
+ +
CloseEvent
+
接続を閉じる際に WebSocket オブジェクトによって送信されるイベント
+ +
MessageEvent
+
サーバからのメッセージの受信時に Websocket オブジェクトによって送出されるイベント
+
diff --git a/files/ja/conflicting/web/api/window/moveto/index.html b/files/ja/conflicting/web/api/window/moveto/index.html new file mode 100644 index 0000000000..1510d2870e --- /dev/null +++ b/files/ja/conflicting/web/api/window/moveto/index.html @@ -0,0 +1,11 @@ +--- +title: Window.restore() +slug: Web/API/Window/restore +translation_of: Web/API/Window/moveTo +translation_of_original: Web/API/Window/restore +--- +

{{APIRef}}

+ +

このメソッドは現在動作していませんが、代わりに次のメソッドを利用することができます:

+ +

window.moveTo(window.screenX, window.screenY);

diff --git a/files/ja/conflicting/web/api/windoworworkerglobalscope/index.html b/files/ja/conflicting/web/api/windoworworkerglobalscope/index.html new file mode 100644 index 0000000000..760541b9c5 --- /dev/null +++ b/files/ja/conflicting/web/api/windoworworkerglobalscope/index.html @@ -0,0 +1,116 @@ +--- +title: WindowBase64 +slug: Web/API/WindowBase64 +tags: + - API +translation_of: Web/API/WindowOrWorkerGlobalScope +translation_of_original: Web/API/WindowBase64 +--- +

{{APIRef("HTML DOM")}}

+ +

The WindowBase64 helper contains utility methods to convert data to and from base64, a binary-to-text encoding scheme. For example it is used in data URIs.

+ +

There is no object of this type, though the context object, either the {{domxref("Window")}} for regular browsing scope, or the {{domxref("WorkerGlobalScope")}}  for workers, implements it.

+ +

Properties

+ +

This helper neither defines nor inherits any properties.

+ +

Methods

+ +

This helper does not inherit any methods.

+ +
+
{{domxref("WindowBase64.atob()")}}
+
Decodes a string of data which has been encoded using base-64 encoding.
+
{{domxref("WindowBase64.btoa()")}}
+
Creates a base-64 encoded ASCII string from a string of binary data.
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#windowbase64', 'WindowBase64')}}{{Spec2('HTML WHATWG')}}No change since the latest snapshot, {{SpecName("HTML5.1")}}.
{{SpecName('HTML5.1', '#windowbase64', 'WindowBase64')}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName("HTML WHATWG")}}. No change.
{{SpecName("HTML5 W3C", "#windowbase64", "WindowBase64")}}{{Spec2('HTML5 W3C')}}Snapshot of {{SpecName("HTML WHATWG")}}. Creation of WindowBase64 (properties where on the target before it).
+ +

Browser compatibility

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support{{CompatGeckoDesktop(1)}} [1]{{CompatVersionUnknown}}10.0{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Basic support{{CompatGeckoMobile(1)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

[1]  atob() is also available to XPCOM components implemented in JavaScript, even though {{domxref("Window")}} is not the global object in components.

+ +

See also

+ + diff --git a/files/ja/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html b/files/ja/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html new file mode 100644 index 0000000000..549969232f --- /dev/null +++ b/files/ja/conflicting/web/api/windoworworkerglobalscope_e2691f7ad05781a30c5fc5bb3b3f633a/index.html @@ -0,0 +1,119 @@ +--- +title: WindowTimers +slug: Web/API/WindowTimers +tags: + - API +translation_of: Web/API/WindowOrWorkerGlobalScope +translation_of_original: Web/API/WindowTimers +--- +
{{APIRef("HTML DOM")}}
+ +

WindowTimers contains utility methods to set and clear timers.

+ +

There is no object of this type, though the context object, either the {{domxref("Window")}} for regular browsing scope, or the {{domxref("WorkerGlobalScope")}}  for workers, implements it.

+ +

Properties

+ +

This interface do not define any property, nor inherit any.

+ +

Methods

+ +

This interface do not inherit any method.

+ +
+
{{domxref("WindowTimers.clearInterval()")}}
+
Cancels the repeated execution set using {{domxref("WindowTimers.setInterval()")}}.
+
{{domxref("WindowTimers.clearTimeout()")}}
+
Cancels the repeated execution set using {{domxref("WindowTimers.setTimeout()")}}.
+
{{domxref("WindowTimers.setInterval()")}}
+
Schedules the execution of a function each X milliseconds.
+
{{domxref("WindowTimers.setTimeout()")}}
+
Sets a delay for executing a function.
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#windowtimers', 'WindowTimers')}}{{Spec2('HTML WHATWG')}}No change since the latest snapshot, {{SpecName("HTML5.1")}}.
{{SpecName('HTML5.1', '#windowtimers', 'WindowTimers')}}{{Spec2('HTML5.1')}}Snapshot of {{SpecName("HTML WHATWG")}}. No change.
{{SpecName("HTML5 W3C", "#windowtimers", "WindowTimers")}}{{Spec2('HTML5 W3C')}}Snapshot of {{SpecName("HTML WHATWG")}}. Creation of WindowBase64 (properties where on the target before it).
+ +

Browser compatibility

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
Basic support{{CompatGeckoDesktop(1)}}1.04.04.01.0
+
+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureFirefox Mobile (Gecko)AndroidIE MobileOpera MobileSafari Mobile
Basic support{{CompatGeckoMobile(1)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
+
+ +

 

+ +

See also

+ + diff --git a/files/ja/conflicting/web/api/xsltprocessor/index.html b/files/ja/conflicting/web/api/xsltprocessor/index.html new file mode 100644 index 0000000000..ca2a707fb7 --- /dev/null +++ b/files/ja/conflicting/web/api/xsltprocessor/index.html @@ -0,0 +1,12 @@ +--- +title: XSLTProcessor +slug: XSLTProcessor +translation_of: Web/API/XSLTProcessor +translation_of_original: XSLTProcessor +--- +

XSLTProcesor は、Mozilla の XSLT エンジンへのインタフェースを提供するオブジェクトです。特権のない JavaScript で利用可能です。

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