diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/ja/web/api/event/target | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/ja/web/api/event/target')
-rw-r--r-- | files/ja/web/api/event/target/index.html | 105 |
1 files changed, 105 insertions, 0 deletions
diff --git a/files/ja/web/api/event/target/index.html b/files/ja/web/api/event/target/index.html new file mode 100644 index 0000000000..d9f91fe452 --- /dev/null +++ b/files/ja/web/api/event/target/index.html @@ -0,0 +1,105 @@ +--- +title: Event.target +slug: Web/API/Event/target +tags: + - API + - DOM + - Event + - Property + - Reference + - delegation + - target +translation_of: Web/API/Event/target +--- +<p>{{ApiRef("DOM")}}</p> + +<p>イベントを発生させたオブジェクトへの参照です。 イベントハンドラーがバブリング、またはキャプチャフェーズの間に呼び出されたとき、{{domxref("event.currentTarget")}} とは異なります。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">theTarget = event.target</pre> + +<h2 id="Example" name="Example">例</h2> + +<p><code>event.target</code> プロパティは、<strong>イベントデリゲーション</strong>を実装するために使用できます。</p> + +<pre><code>// リストを作ります +var ul = document.createElement('ul'); +document.body.appendChild(ul); + +var li1 = document.createElement('li'); +var li2 = document.createElement('li'); +ul.appendChild(li1); +ul.appendChild(li2); + +function hide(e){ + // e.target はクリックされた <li> 要素を参照します + // これはコンテキスト内の親 <ul> を参照する e.currentTarget とは異なります + e.target.style.visibility = 'hidden'; +} + +// リストにリスナーを接続します +// <li> がクリックされた時に発火します +ul.addEventListener('click', hide, false);</code> + +</pre> + +<p> </p> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<p> </p> + +<table class="standard-table"> + <tbody> + <tr> + <th>仕様</th> + <th>状態</th> + <th>コメント</th> + </tr> + <tr> + <td>{{SpecName("DOM WHATWG", "#dom-event-target", "Event.target")}}</td> + <td>{{Spec2("DOM WHATWG")}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName("DOM4", "#dom-event-target", "Event.target")}}</td> + <td>{{Spec2("DOM4")}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName("DOM2 Events", "#Events-Event-target", "Event.target")}}</td> + <td>{{Spec2("DOM2 Events")}}</td> + <td>初回定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> + +<p> </p> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>and send us a pull request.</p> +</div> + +<p>{{Compat("api.Event.target")}}</p> + +<p> </p> + +<h2 id="Compatibility_notes" name="Compatibility_notes">互換性のための注記</h2> + +<p>IE 6-8 では、イベントモデルが異なります。イベントリスナーは、非標準の {{domxref('EventTarget.attachEvent')}} メソッドでアタッチされます。このモデルでは、イベントオブジェクトは <code>target</code> プロパティの代わりに、{{domxref('Event.srcElement')}} プロパティを持っており、意味的には <code>event.target</code> と同じです。</p> + +<pre class="brush: js">function hide(e) { + // IE6-8 をサポート + var target = e.target || e.srcElement; + target.style.visibility = 'hidden'; +} +</pre> + +<h2 id="See_also" name="See_also">関連項目</h2> + +<ul> + <li><a href="/ja/docs/Web/API/Event/Comparison_of_Event_Targets">イベントターゲットの比較</a></li> +</ul> |