initial commit

15 files changed, 1580 insertions, 0 deletions

diff --git a/files/zh-tw/web/api/event/bubbles/index.html b/files/zh-tw/web/api/event/bubbles/index.html
new file mode 100644
index 0000000000..4a495fc672
--- /dev/null
+++ b/files/zh-tw/web/api/event/bubbles/index.html
@@ -0,0 +1,63 @@
+---
+title: Event.bubbles
+slug: Web/API/Event/bubbles
+translation_of: Web/API/Event/bubbles
+---
+<p>{{ ApiRef("DOM") }}</p>
+
+<h3 id="Summary" name="Summary">概述</h3>
+
+<p>表示事件是否會向上冒泡傳遞。</p>
+
+<h3 id="語法">語法</h3>
+
+<pre class="eval"><em>var bool</em> = event.bubbles;
+</pre>
+
+<p>回傳一個布林值，若事件會向上冒泡傳遞則回傳 <code>true</code>。</p>
+
+<h3 id="Notes" name="Notes">備註</h3>
+
+<p>Only certain events can bubble. Events that do bubble have this property set to <code>true</code>. You can use this property to check if an event is allowed to bubble or not.</p>
+
+<h3 id="Example" name="Example">範例</h3>
+
+<pre class="brush: js"> function goInput(e) {
+  // checks bubbles and
+  if (!e.bubbles) {
+     // passes event along if it's not
+     passItOn(e);
+  }
+  // already bubbling
+  doOutput(e)
+}
+</pre>
+
+<h2 id="Specifications" name="Specifications">規範</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG', '#dom-event-bubbles', 'Event.bubbles')}}</td>
+   <td>{{ Spec2('DOM WHATWG') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM4', '#dom-event-bubbles', 'Event.bubbles')}}</td>
+   <td>{{ Spec2('DOM4') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events', '#Events-Event-canBubble', 'Event.bubbles')}}</td>
+   <td>{{ Spec2('DOM2 Events') }}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
diff --git a/files/zh-tw/web/api/event/comparison_of_event_targets/index.html b/files/zh-tw/web/api/event/comparison_of_event_targets/index.html
new file mode 100644
index 0000000000..211463b1a7
--- /dev/null
+++ b/files/zh-tw/web/api/event/comparison_of_event_targets/index.html
@@ -0,0 +1,164 @@
+---
+title: Comparison of Event Targets
+slug: Web/API/Event/Comparison_of_Event_Targets
+translation_of: Web/API/Event/Comparison_of_Event_Targets
+---
+<p>{{ ApiRef() }}</p>
+
+<h3 id="Event_targets" name="Event_targets">Event targets</h3>
+
+<p>It's easy to get confused about which target to examine when writing an event handler. This article should clarify the use of the target properties.</p>
+
+<p>There are 5 targets to consider:</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Property</th>
+   <th>Defined in</th>
+   <th>Purpose</th>
+  </tr>
+  <tr>
+   <td><a href="/en/DOM/event.target" title="en/DOM/event.target">event.target</a></td>
+   <td><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-interface">DOM Event Interface</a></td>
+   <td>
+    <p>The DOM element on the lefthand side of the call that triggered this event, eg:</p>
+
+    <pre class="eval">
+<em>element</em>.dispatchEvent(<em>event</em>)
+</pre>
+   </td>
+  </tr>
+  <tr>
+   <td><a href="/en/DOM/event.currentTarget" title="en/DOM/event.currentTarget">event.currentTarget</a></td>
+   <td><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-interface">DOM Event Interface</a></td>
+   <td>The <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-EventTarget"><code>EventTarget</code></a> whose <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-EventListener"><code>EventListeners</code></a> are currently being processed. As the event capturing and bubbling occurs this value changes.</td>
+  </tr>
+  <tr>
+   <td><a href="/en/DOM/event.relatedTarget" title="en/DOM/event.relatedTarget">event.relatedTarget</a></td>
+   <td><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-MouseEvent">DOM MouseEvent Interface</a></td>
+   <td>Identifies a secondary target for the event.</td>
+  </tr>
+  <tr>
+   <td><a href="/en/DOM/event.explicitOriginalTarget" title="en/DOM/event.explicitOriginalTarget">event.explicitOriginalTarget</a></td>
+   <td>{{ Source("/dom/public/idl/events/nsIDOMNSEvent.idl", "nsIDOMNSEvent.idl") }}</td>
+   <td>{{ Non-standard_inline() }} If the event was retargeted for some reason other than an anonymous boundary crossing, this will be set to the target before the retargeting occurs. For example, mouse events are retargeted to their parent node when they happen over text nodes ({{ Bug("185889") }}), and in that case <code>.target</code> will show the parent and <code>.explicitOriginalTarget</code> will show the text node.<br>
+    Unlike <code>.originalTarget</code>, <code>.explicitOriginalTarget</code> will never contain anonymous content.</td>
+  </tr>
+  <tr>
+   <td><a href="/en/DOM/event.originalTarget" title="en/DOM/event.originalTarget">event.originalTarget</a></td>
+   <td>{{ Source("/dom/public/idl/events/nsIDOMNSEvent.idl", "nsIDOMNSEvent.idl") }}</td>
+   <td>{{ Non-standard_inline() }} The original target of the event, before any retargetings. See <a href="/en-US/docs/XBL/XBL_1.0_Reference/Anonymous_Content#Event_Flow_and_Targeting" title="en/XBL/XBL_1.0_Reference/Anonymous_Content#Event_Flow_and_Targeting">Anonymous Content#Event_Flow_and_Targeting</a> for details.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Use_of_explicitOriginalTarget_and_originalTarget" name="Use_of_explicitOriginalTarget_and_originalTarget">Use of <code>explicitOriginalTarget</code> and <code>originalTarget</code></h3>
+
+<p>TODO: Only available in a Mozilla-based browser? TODO: Only suitable for extension-developers?</p>
+
+<h3 id="Examples" name="Examples">範例</h3>
+
+<pre>&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+    &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
+    &lt;title&gt;Comparison of Event Targets&lt;/title&gt;
+    &lt;style&gt;
+        table {
+            border-collapse: collapse;
+            height: 150px;
+            width: 100%;
+        }
+        td {
+            border: 1px solid #ccc;
+            font-weight: bold;
+            padding: 5px;
+            min-height: 30px;
+        }
+        .standard {
+            background-color: #99ff99;
+        }
+        .non-standard {
+            background-color: #902D37;
+        }
+    &lt;/style&gt;
+&lt;/head&gt;
+&lt;body&gt;
+    &lt;table&gt;
+    &lt;thead&gt;
+        &lt;tr&gt;
+            &lt;td class="standard"&gt;Original target dispatching the event &lt;small&gt;event.target&lt;/small&gt;&lt;/td&gt;
+            &lt;td class="standard"&gt;Target who's event listener is being processed &lt;small&gt;event.currentTarget&lt;/small&gt;&lt;/td&gt;
+            &lt;td class="standard"&gt;Identify other element (if any) involved in the event &lt;small&gt;event.relatedTarget&lt;/small&gt;&lt;/td&gt;
+            &lt;td class="non-standard"&gt;If there was a retargetting of the event for some reason &lt;small&gt; event.explicitOriginalTarget&lt;/small&gt; contains the target before retargetting (never contains anonymous targets)&lt;/td&gt;
+            &lt;td class="non-standard"&gt;If there was a retargetting of the event for some reason &lt;small&gt; event.originalTarget&lt;/small&gt; contains the target before retargetting (may contain anonymous targets)&lt;/td&gt;
+        &lt;/tr&gt;
+    &lt;/thead&gt;
+    &lt;tr&gt;
+        &lt;td id="target"&gt;&lt;/td&gt;
+        &lt;td id="currentTarget"&gt;&lt;/td&gt;
+        &lt;td id="relatedTarget"&gt;&lt;/td&gt;
+        &lt;td id="explicitOriginalTarget"&gt;&lt;/td&gt;
+        &lt;td id="originalTarget"&gt;&lt;/td&gt;
+    &lt;/tr&gt;
+&lt;/table&gt;
+&lt;p&gt;Clicking on the text will show the difference between explicitOriginalTarget, originalTarget and target&lt;/p&gt;
+&lt;script&gt;
+    function handleClicks(e) {
+        document.getElementById('target').innerHTML = e.target;
+        document.getElementById('currentTarget').innerHTML = e.currentTarget;
+        document.getElementById('relatedTarget').innerHTML = e.relatedTarget;
+        document.getElementById('explicitOriginalTarget').innerHTML = e.explicitOriginalTarget;
+        document.getElementById('originalTarget').innerHTML = e.originalTarget;
+    }
+
+    function handleMouseover(e) {
+        document.getElementById('target').innerHTML = e.target;
+        document.getElementById('relatedTarget').innerHTML = e.relatedTarget;
+    }
+
+    document.addEventListener('click', handleClicks, false);
+    document.addEventListener('mouseover', handleMouseover, false);
+&lt;/script&gt;
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<h3 id="Use_of_target_and_relatedTarget" name="Use_of_target_and_relatedTarget">Use of <code>target</code> and <code>relatedTarget</code></h3>
+
+<p>The <code>relatedTarget</code> property for the <code>mouseover</code> event holds the node that the mouse was previously over. For the <code>mouseout</code> event, it holds the node that the mouse moved to.</p>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Event type</th>
+   <th><a href="/en/DOM/event.target" title="en/DOM/event.target">event.target</a></th>
+   <th><a href="/en/DOM/event.relatedTarget" title="en/DOM/event.relatedTarget">event.relatedTarget</a></th>
+  </tr>
+  <tr>
+   <td><code>mouseover</code></td>
+   <td>the EventTarget which the pointing device entered</td>
+   <td>the EventTarget which the pointing device exited</td>
+  </tr>
+  <tr>
+   <td><code>mouseout</code></td>
+   <td>the EventTarget which the pointing device exited</td>
+   <td>the EventTarget which the pointing device entered</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>TODO: Also needs descriptions about <code>dragenter</code> and <code>dragexit</code> events.</p>
+
+<h4 id="Example" name="Example">範例</h4>
+
+<pre class="eval">&lt;hbox id="outer"&gt;
+  &lt;hbox id="inner"
+        onmouseover="dump('mouseover ' + event.relatedTarget.id + ' &gt; ' + event.target.id + '\n');"
+        onmouseout="dump('mouseout  ' + event.target.id + ' &gt; ' + event.relatedTarget.id + '\n');"
+        style="margin: 100px; border: 10px solid black; width: 100px; height: 100px;" /&gt;
+&lt;/hbox&gt;
+</pre>
+
+<p> </p>
diff --git a/files/zh-tw/web/api/event/createevent/index.html b/files/zh-tw/web/api/event/createevent/index.html
new file mode 100644
index 0000000000..fd60d1089d
--- /dev/null
+++ b/files/zh-tw/web/api/event/createevent/index.html
@@ -0,0 +1,29 @@
+---
+title: Event.createEvent()
+slug: Web/API/Event/createEvent
+translation_of: Web/API/Document/createEvent
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p>建立一個新的事件，該事件必須先以其 <code>init()</code> method 初始化才行。</p>
+
+<h3 id="語法">語法</h3>
+
+<pre><code>document.createEvent(type) </code></pre>
+
+<dl>
+ <dt><code>type</code></dt>
+ <dd>一個 string 。表示所建立的事件名稱。</dd>
+</dl>
+
+<p>這個 method 會回傳一個新的 DOM {{ domxref("Event") }} object ，其事件類型為傳入的 type 。該事件必須先初始化才能使用。</p>
+
+<h3 id="範例">範例</h3>
+
+<pre class="brush: js">var newEvent = document.createEvent("UIEvents");</pre>
+
+<h3 id="規格定義">規格定義</h3>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-document" title="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-document">DOM Level 2 Events</a></li>
+</ul>
diff --git a/files/zh-tw/web/api/event/currenttarget/index.html b/files/zh-tw/web/api/event/currenttarget/index.html
new file mode 100644
index 0000000000..2be9aeb4e7
--- /dev/null
+++ b/files/zh-tw/web/api/event/currenttarget/index.html
@@ -0,0 +1,70 @@
+---
+title: Event.currentTarget
+slug: Web/API/Event/currentTarget
+translation_of: Web/API/Event/currentTarget
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p>{{domxref("Event")}} 介面的唯讀屬性 <code><strong>currentTarget</strong></code> 會標明事件指向（current target）、還有該事件所遍歷的 DOM。屬性總會指向當時處理該事件的事件監聽器所註冊的 DOM 物件，而 {{domxref("event.target")}} 屬性則是永遠指向觸發事件的 DOM 物件。</p>
+
+<h2 id="範例">範例</h2>
+
+<p><code>event.currentTarget</code> 在把相同的事件監聽器，附加到多個元素時，會出現很有趣的事情：</p>
+
+<pre class="brush: js">function hide(e){
+  e.currentTarget.style.visibility = "hidden";
+  // 在這個函式用於事件監聽器時： this === e.currentTarget
+}
+
+var ps = document.getElementsByTagName('p');
+
+for(var i = 0; i &lt; ps.length; i++){
+  ps[i].addEventListener('click', hide, false);
+}
+
+// 單擊四周的話 p 元素就會消失
+</pre>
+
+<h2 id="規範">規範</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>規範</th>
+   <th>狀態</th>
+   <th>註解</th>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM WHATWG", "#dom-event-currenttarget", "Event.currentTarget")}}</td>
+   <td>{{Spec2("DOM WHATWG")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM4", "#dom-event-currenttarget", "Event.currentTarget")}}</td>
+   <td>{{Spec2("DOM4")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM3 Events", "#dfn-current-event-target", "current event target")}}</td>
+   <td>{{Spec2("DOM3 Events")}}</td>
+   <td></td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM2 Events", "#Events-Event-currentTarget", "Event.currentTarget")}}</td>
+   <td>{{Spec2("DOM2 Events")}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器相容性">瀏覽器相容性</h2>
+
+
+
+<p>{{Compat("api.Event.currentTarget")}}</p>
+
+<h2 id="參見">參見</h2>
+
+<ul>
+ <li><a href="/zh-TW/docs/Web/API/Event/Comparison_of_Event_Targets">事件指向的比較</a></li>
+</ul>
diff --git a/files/zh-tw/web/api/event/defaultprevented/index.html b/files/zh-tw/web/api/event/defaultprevented/index.html
new file mode 100644
index 0000000000..d0814682a8
--- /dev/null
+++ b/files/zh-tw/web/api/event/defaultprevented/index.html
@@ -0,0 +1,100 @@
+---
+title: Event.defaultPrevented
+slug: Web/API/Event/defaultPrevented
+translation_of: Web/API/Event/defaultPrevented
+---
+<div>{{ APIRef("DOM") }}</div>
+
+<h2 id="概述">概述</h2>
+
+<p>回傳一個布林值，表示事件的預設行為是否被取消，也就是事件物件是否曾執行 {{domxref("event.preventDefault()", "preventDefault()")}} 方法。</p>
+
+<div class="note"><strong>註：</strong>You should use this instead of the non-standard, deprecated<code> getPreventDefault()</code> method (see {{ bug(691151) }}).</div>
+
+<h2 id="語法">語法</h2>
+
+<pre class="eval">bool = event.defaultPrevented </pre>
+
+<h2 id="範例">範例</h2>
+
+<pre> if (e.defaultPrevented) {
+   /* the default was prevented */
+ }
+</pre>
+
+<h2 id="規範">規範</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG', '#dom-event-defaultprevented', 'Event.defaultPrevented()')}}</td>
+   <td>{{ Spec2('DOM WHATWG') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM4', '#dom-event-defaultprevented', 'Event.defaultPrevented')}}</td>
+   <td>{{Spec2('DOM4')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器相容性"><span style="font-size: 1.71428571428571rem; letter-spacing: -0.021em; line-height: 1;">瀏覽器相容性</span></h2>
+
+<p>{{ CompatibilityTable() }}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatChrome(18) }}</td>
+   <td>{{ CompatGeckoDesktop("6.0") }}</td>
+   <td>{{ CompatIE(9.0) }}</td>
+   <td>{{ CompatOpera(11.0) }}</td>
+   <td>{{ CompatSafari("5.0") }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatGeckoMobile("6.0") }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatUnknown() }}</td>
+   <td>{{ CompatSafari(5.0) }}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<ul>
+</ul>
diff --git a/files/zh-tw/web/api/event/event/index.html b/files/zh-tw/web/api/event/event/index.html
new file mode 100644
index 0000000000..bbbd74c5b2
--- /dev/null
+++ b/files/zh-tw/web/api/event/event/index.html
@@ -0,0 +1,87 @@
+---
+title: Event()
+slug: Web/API/Event/Event
+translation_of: Web/API/Event/Event
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p><code><strong>Event()</strong></code> constructor 能用來建立一個 {{domxref("Event", "事件")}} 。</p>
+
+<h2 id="語法">語法</h2>
+
+<pre class="syntaxbox"><em>event</em> = new Event(<em>typeArg</em>, <em>eventInit</em>);</pre>
+
+<h3 id="參數">參數</h3>
+
+<dl>
+ <dt><em>typeArg</em></dt>
+ <dd>為一 {{domxref("DOMString")}} ，用來表示事件名稱。</dd>
+ <dt><em>eventInit</em>{{optional_inline}}</dt>
+ <dd>一個 <code>EventInit</code> object，包含以下欄位
+ <table class="standard-table">
+  <thead>
+   <tr>
+    <th>參數</th>
+    <th>可選</th>
+    <th>默認值</th>
+    <th>類型</th>
+    <th>說明</th>
+   </tr>
+  </thead>
+  <tbody>
+   <tr>
+    <td><code>"bubbles"</code></td>
+    <td>●</td>
+    <td><code>false</code></td>
+    <td><code>{{jsxref("Boolean")}}</code></td>
+    <td>表示該事件是否懸浮（bubble up）。</td>
+   </tr>
+   <tr>
+    <td><code>"cancelable"</code></td>
+    <td>●</td>
+    <td><code>false</code></td>
+    <td>{{jsxref("Boolean")}}</td>
+    <td>表示該事件是否已取消（canale）。</td>
+   </tr>
+  </tbody>
+ </table>
+ </dd>
+</dl>
+
+<h2 id="範例">範例</h2>
+
+<pre class="brush: js">// 建立一個 bubbles up 、並未被取消的事件 “look” 。
+var ev = new Event("look", {"bubbles":true, "cancelable":false});
+document.dispatchEvent(ev);
+</pre>
+
+<h2 id="規格">規格</h2>
+
+<table class="standard-table" style="height: 49px; width: 1000px;">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG','#interface-event','Event()')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器相容性">瀏覽器相容性</h2>
+
+
+
+<p>{{Compat("api.Event.Event")}}</p>
+
+<h2 id="參見">參見</h2>
+
+<ul>
+ <li>{{domxref("Event")}}</li>
+</ul>
diff --git a/files/zh-tw/web/api/event/eventphase/index.html b/files/zh-tw/web/api/event/eventphase/index.html
new file mode 100644
index 0000000000..e146e7b230
--- /dev/null
+++ b/files/zh-tw/web/api/event/eventphase/index.html
@@ -0,0 +1,179 @@
+---
+title: Event.eventPhase
+slug: Web/API/Event/eventPhase
+translation_of: Web/API/Event/eventPhase
+---
+<p>{{ApiRef("DOM")}}</p>
+
+<p>表示事件物件目前於事件流（Event Flow）中傳遞的進度為哪一個階段。</p>
+
+<h2 id="語法">語法</h2>
+
+<pre class="brush: js"><em>var phase</em> = event.eventPhase;
+</pre>
+
+<p>回傳一個整數值以代表目前事件於事件流中的傳遞階段，可能的值將於{{anch("事件傳遞階段常數")}}說明。</p>
+
+<h2 id="常數">常數</h2>
+
+<h3 id="事件傳遞階段常數">事件傳遞階段常數</h3>
+
+<p>These values describe which phase the event flow is currently being evaluated.</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">常數</th>
+   <th scope="col">值</th>
+   <th scope="col">說明</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{domxref("Event.NONE")}} {{readonlyinline}}</td>
+   <td>0</td>
+   <td>No event is being processed at this time.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("Event.CAPTURING_PHASE")}} {{readonlyinline}}</td>
+   <td>1</td>
+   <td>The event is being propagated through the target's ancestor objects. This process starts with the {{domxref("Window")}}, then {{domxref("Document")}}, then the {{domxref("HTMLHtmlElement")}}, and so on through the elements until the target's parent is reached. {{domxref("EventListener", "Event listeners", "", 1)}} registered for capture mode when {{domxref("EventTarget.addEventListener()")}} was called are triggered during this phase.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("Event.AT_TARGET")}} {{readonlyinline}}</td>
+   <td>2</td>
+   <td>The event has arrived at {{domxref("EventTarget", "the event's target", "", 1)}}. Event listeners registered for this phase are called at this time. If {{domxref("Event.bubbles")}} is false, processing the event is finished after this phase is complete.</td>
+  </tr>
+  <tr>
+   <td>{{domxref("Event.BUBBLING_PHASE")}} {{readonlyinline}}</td>
+   <td>3</td>
+   <td>The event is propagating back up through the target's ancestors in reverse order, starting with the parent, and eventually reaching the containing {{domxref("Window")}}. This is known as bubbling, and occurs only if {{domxref("Event.bubbles")}} is <code>true</code>. {{domxref("EventListener", "Event listeners", "", 1)}} registered for this phase are triggered during this process.</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>For more details, see <a class="external" href="http://www.w3.org/TR/DOM-Level-3-Events/#event-flow">section 3.1, Event dispatch and DOM event flow</a>, of the DOM Level 3 Events specification.</p>
+
+<h2 id="Example" name="Example">範例</h2>
+
+<h3 id="HTML_Content">HTML Content</h3>
+
+<pre class="brush: html">&lt;h4&gt;Event Propagation Chain&lt;/h4&gt;
+&lt;ul&gt;
+  &lt;li&gt;Click 'd1'&lt;/li&gt;
+  &lt;li&gt;Analyse event propagation chain&lt;/li&gt;
+  &lt;li&gt;Click next div and repeat the experience&lt;/li&gt;
+  &lt;li&gt;Change Capturing mode&lt;/li&gt;
+  &lt;li&gt;Repeat the experience&lt;/li&gt;
+&lt;/ul&gt;
+&lt;input type="checkbox" id="chCapture" /&gt;
+&lt;label for="chCapture"&gt;Use Capturing&lt;/label&gt;
+ &lt;div id="d1"&gt;d1
+  &lt;div id="d2"&gt;d2
+      &lt;div id="d3"&gt;d3
+          &lt;div id="d4"&gt;d4&lt;/div&gt;
+      &lt;/div&gt;
+  &lt;/div&gt;
+ &lt;/div&gt;
+ &lt;div id="divInfo"&gt;&lt;/div&gt;
+</pre>
+
+<h3 id="CSS_Content">CSS Content</h3>
+
+<pre class="brush: css">div {
+  margin: 20px;
+  padding: 4px;
+  border: thin black solid;
+}
+
+#divInfo {
+  margin: 18px;
+  padding: 8px;
+  background-color:white;
+  font-size:80%;
+}</pre>
+
+<h3 id="JavaScript_Content">JavaScript Content</h3>
+
+<pre class="brush: js">var clear = false, divInfo = null, divs = null, useCapture = false;
+window.onload = function () {
+  divInfo = document.getElementById("divInfo");
+  divs = document.getElementsByTagName('div');
+  chCapture = document.getElementById("chCapture");
+  chCapture.onclick = function () {
+    RemoveListeners();
+    AddListeners();
+  }
+  Clear();
+  AddListeners();
+}
+
+function RemoveListeners() {
+  for (var i = 0; i &lt; divs.length; i++) {
+    var d = divs[i];
+    if (d.id != "divInfo") {
+      d.removeEventListener("click", OnDivClick, true);
+      d.removeEventListener("click", OnDivClick, false);
+    }
+  }
+}
+
+function AddListeners() {
+  for (var i = 0; i &lt; divs.length; i++) {
+    var d = divs[i];
+    if (d.id != "divInfo") {
+      d.addEventListener("click", OnDivClick, false);
+      if (chCapture.checked)
+        d.addEventListener("click", OnDivClick, true);
+      d.onmousemove = function () { clear = true; };
+    }
+  }
+}
+
+function OnDivClick(e) {
+  if (clear) {
+    Clear(); clear = false;
+  }
+  if (e.eventPhase == 2)
+    e.currentTarget.style.backgroundColor = 'red';
+  var level = e.eventPhase == 0 ? "none" : e.eventPhase == 1 ? "capturing" : e.eventPhase == 2 ? "target" : e.eventPhase == 3 ? "bubbling" : "error";
+  divInfo.innerHTML += e.currentTarget.id + "; eventPhase: " + level + "&lt;br/&gt;";
+}
+
+function Clear() {
+  for (var i = 0; i &lt; divs.length; i++) {
+    if (divs[i].id != "divInfo")
+      divs[i].style.backgroundColor = (i &amp; 1) ? "#f6eedb" : "#cceeff";
+  }
+  divInfo.innerHTML = '';
+}
+</pre>
+
+<p>{{ EmbedLiveSample('Example', '', '700', '', 'Web/API/Event/eventPhase') }}</p>
+
+<h2 id="規範">規範</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Specification</th>
+   <th>Status</th>
+   <th>Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM WHATWG", "#dom-event-eventphase", "Event.eventPhase")}}</td>
+   <td>{{Spec2("DOM WHATWG")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM4", "#dom-event-eventphase", "Event.eventPhase")}}</td>
+   <td>{{Spec2("DOM4")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM2 Events", "#Events-Event-eventPhase", "Event.eventPhase")}}</td>
+   <td>{{Spec2("DOM2 Events")}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
diff --git a/files/zh-tw/web/api/event/index.html b/files/zh-tw/web/api/event/index.html
new file mode 100644
index 0000000000..4213c20080
--- /dev/null
+++ b/files/zh-tw/web/api/event/index.html
@@ -0,0 +1,210 @@
+---
+title: Event
+slug: Web/API/Event
+tags:
+  - API
+  - DOM
+  - Event
+  - Interface
+  - NeedsTranslation
+  - Reference
+  - Référence(2)
+  - TopicStub
+translation_of: Web/API/Event
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p><code><strong>Event</strong></code> 介面表示了一個在 DOM 物件上所發生的事件。</p>
+
+<p>一個事件可以是由使用者的操作行為所產生（如：點擊滑鼠按鈕或敲打鍵盤），或是來自 API 因處理非同步任務所產生。事件也可以為程式所觸發，例如呼叫元素的 <a href="https://developer.mozilla.org/zh-TW/docs/Web/API/HTMLElement/click" title="The HTMLElement.click() method simulates a mouse click on an element."><code>HTMLElement.click()</code></a> 方法，或是自行定義事件並使用 <a href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/dispatchEvent" title="Dispatches an Event at the specified EventTarget, (synchronously) invoking the affected EventListeners in the appropriate order. The normal event processing rules (including the capturing and optional bubbling phase) also apply to events dispatched manually with dispatchEvent()."><code>EventTarget.dispatchEvent()</code></a> 發送至特定的目標。</p>
+
+<p>事件有多種不同的類型，部分事件是使用基於 <code>Event</code> 的子介面。<code>Event</code> 本身包含了所有事件共同的屬性及方法。</p>
+
+<p>許多 DOM 元素可被設定接受（accept，或稱為 listen "監聽"）這些事件，並在發生時執行處理（process、handle）事件的程式碼。事件處理器（Event-handlers）通常會使用 <code>EventTarget.addEventListener()</code> 來被連結（connected，或稱為 attached "附加"）至各個 <a href="https://developer.mozilla.org/zh-TW/docs/Web/HTML/Element">HTML 元素</a>（例如 &lt;button&gt;、&lt;div&gt;、&lt;div&gt;、&lt;span&gt; 等），且此方式一般也是用來取代舊的 HTML <a href="https://developer.mozilla.org/zh-TW/docs/HTML/Global_attributes">事件處理器屬性（attributes）</a>。此外，在需要時也可以使用 <a href="https://developer.mozilla.org/zh-TW/docs/Web/API/EventTarget/removeEventListener" title="The EventTarget.removeEventListener() method removes from the EventTarget an event listener previously registered with EventTarget.addEventListener(). The event listener to be removed is identified using a combination of the event type, the event listener function itself, and various optional options that may affect the matching process; see Matching event listeners for removal"><code>removeEventListener()</code></a> 來中斷事件處理器與元素的連結。請留意一個元素可以擁有多個事件處理器（即使是處理同一種事件的不同處理器），特別是那些被切分開來彼此獨立且有不同目標的程式模組（舉例來說，廣告及統計模組可以同時監控網頁中的影片觀看資訊）。</p>
+
+<p>When there are many nested elements, each with its own handler(s), event processing can become very complicated -- especially where a parent element receives the very same event as its child elements because "spatially" they overlap so the event technically occurs in both, and the processing order of such events depends on the <a href="https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Event_bubbling_and_capture">Event bubbling and capture</a> settings of each handler triggered.</p>
+
+<h2 id="Introduction" name="Introduction">基於 <code>Event</code> 的子介面</h2>
+
+<p>Below is a list of interfaces which are based on the main <code>Event</code> interface, with links to their respective documentation in the MDN API reference. Note that all event interfaces have names which end in "Event".</p>
+
+<div class="index">
+<ul>
+ <li>{{domxref("AnimationEvent")}}</li>
+ <li>{{domxref("AudioProcessingEvent")}}</li>
+ <li>{{domxref("BeforeInputEvent")}}</li>
+ <li>{{domxref("BeforeUnloadEvent")}}</li>
+ <li>{{domxref("BlobEvent")}}</li>
+ <li>{{domxref("ClipboardEvent")}}</li>
+ <li>{{domxref("CloseEvent")}}</li>
+ <li>{{domxref("CompositionEvent")}}</li>
+ <li>{{domxref("CSSFontFaceLoadEvent")}}</li>
+ <li>{{domxref("CustomEvent")}}</li>
+ <li>{{domxref("DeviceLightEvent")}}</li>
+ <li>{{domxref("DeviceMotionEvent")}}</li>
+ <li>{{domxref("DeviceOrientationEvent")}}</li>
+ <li>{{domxref("DeviceProximityEvent")}}</li>
+ <li>{{domxref("DOMTransactionEvent")}}</li>
+ <li>{{domxref("DragEvent")}}</li>
+ <li>{{domxref("EditingBeforeInputEvent")}}</li>
+ <li>{{domxref("ErrorEvent")}}</li>
+ <li>{{domxref("FetchEvent")}}</li>
+ <li>{{domxref("FocusEvent")}}</li>
+ <li>{{domxref("GamepadEvent")}}</li>
+ <li>{{domxref("HashChangeEvent")}}</li>
+ <li>{{domxref("IDBVersionChangeEvent")}}</li>
+ <li>{{domxref("InputEvent")}}</li>
+ <li>{{domxref("KeyboardEvent")}}</li>
+ <li>{{domxref("MediaStreamEvent")}}</li>
+ <li>{{domxref("MessageEvent")}}</li>
+ <li>{{domxref("MouseEvent")}}</li>
+ <li>{{domxref("MutationEvent")}}</li>
+ <li>{{domxref("OfflineAudioCompletionEvent")}}</li>
+ <li>{{domxref("OverconstrainedError")}}</li>
+ <li>{{domxref("PageTransitionEvent")}}</li>
+ <li>{{domxref("PaymentRequestUpdateEvent")}}</li>
+ <li>{{domxref("PointerEvent")}}</li>
+ <li>{{domxref("PopStateEvent")}}</li>
+ <li>{{domxref("ProgressEvent")}}</li>
+ <li>{{domxref("RelatedEvent")}}</li>
+ <li>{{domxref("RTCDataChannelEvent")}}</li>
+ <li>{{domxref("RTCIdentityErrorEvent")}}</li>
+ <li>{{domxref("RTCIdentityEvent")}}</li>
+ <li>{{domxref("RTCPeerConnectionIceEvent")}}</li>
+ <li>{{domxref("SensorEvent")}}</li>
+ <li>{{domxref("StorageEvent")}}</li>
+ <li>{{domxref("SVGEvent")}}</li>
+ <li>{{domxref("SVGZoomEvent")}}</li>
+ <li>{{domxref("TimeEvent")}}</li>
+ <li>{{domxref("TouchEvent")}}</li>
+ <li>{{domxref("TrackEvent")}}</li>
+ <li>{{domxref("TransitionEvent")}}</li>
+ <li>{{domxref("UIEvent")}}</li>
+ <li>{{domxref("UserProximityEvent")}}</li>
+ <li>{{domxref("WebGLContextEvent")}}</li>
+ <li>{{domxref("WheelEvent")}}</li>
+</ul>
+</div>
+
+<h2 id="Constructor" name="Constructor">建構式</h2>
+
+<dl>
+ <dt>{{domxref("Event.Event", "Event()")}}</dt>
+ <dd>建立一個 <code>Event</code> 物件。</dd>
+</dl>
+
+<h2 id="屬性" name="屬性">屬性</h2>
+
+<dl>
+ <dt>{{domxref("Event.bubbles")}} {{readonlyinline}}</dt>
+ <dd>布林值，表示事件是否會向上冒泡傳遞。</dd>
+ <dt>{{domxref("Event.cancelBubble")}}</dt>
+ <dd>由於歷史性因素，此屬性的效果等同於 {{domxref("Event.stopPropagation()", "stopPropagation()")}} 方法。若在事件處理器回傳前設定此值為 <code>true</code>，可阻止事件繼續向上冒泡傳遞。</dd>
+ <dt>{{domxref("Event.cancelable")}} {{readonlyinline}}</dt>
+ <dd>布林值，表示事件是否能被取消。</dd>
+ <dt>{{domxref("Event.composed")}} {{ReadOnlyInline}}</dt>
+ <dd>A Boolean value indicating whether or not the event can bubble across the boundary between the shadow DOM and the regular DOM.</dd>
+ <dt>{{domxref("Event.currentTarget")}} {{readonlyinline}}</dt>
+ <dd>指向目前處理事件之監聽器所屬的 DOM 物件。</dd>
+ <dt>{{domxref("Event.deepPath")}} {{non-standard_inline}}</dt>
+ <dd>An {{jsxref("Array")}} of DOM {{domxref("Node")}}s through which the event has bubbled.</dd>
+ <dt>{{domxref("Event.defaultPrevented")}} {{readonlyinline}}</dt>
+ <dd>布林值，表示事件的預設行為是否被 {{domxref("event.preventDefault()", "preventDefault()")}} 方法所取消。</dd>
+ <dt>{{domxref("Event.eventPhase")}} {{readonlyinline}}</dt>
+ <dd>表示事件目前的傳遞階段。</dd>
+ <dt>{{domxref("Event.explicitOriginalTarget")}} {{non-standard_inline}} {{readonlyinline}}</dt>
+ <dd>事件的明確原定目標（Mozilla 專屬）。</dd>
+ <dt>{{domxref("Event.originalTarget")}} {{non-standard_inline}} {{readonlyinline}}</dt>
+ <dd>事件重新導向前的原定目標（Mozilla 專屬）。</dd>
+ <dt>{{domxref("Event.returnValue")}}</dt>
+ <dd>非標準屬性。用以替代 {{domxref("Event.preventDefault()", "preventDefault()")}} 方法與 {{domxref("Event.defaultPrevented", "defaultPrevented")}} 屬性（舊版 Internet Explorer 專屬）。</dd>
+ <dt>{{domxref("Event.scoped")}} {{readonlyinline}} {{obsolete_inline}}</dt>
+ <dd>A {{jsxref("Boolean")}} indicating whether the given event will bubble across through the shadow root into the standard DOM. This property has been renamed to {{domxref("Event.composed", "composed")}}.</dd>
+ <dt>{{domxref("Event.srcElement")}} {{non-standard_inline}}</dt>
+ <dd>非標準屬性。為 {{domxref("Event.target", "target")}} 屬性的別名（舊版 Internet Explorer 專屬）。</dd>
+ <dt>{{domxref("Event.target")}} {{readonlyinline}}</dt>
+ <dd>指向最初觸發事件的 DOM 物件。</dd>
+ <dt>{{domxref("Event.timeStamp")}} {{readonlyinline}}</dt>
+ <dd>事件發生（事件物件建立）至今的時間。</dd>
+ <dt>{{domxref("Event.type")}} {{readonlyinline}}</dt>
+ <dd>事件類型（不區分大小寫）。</dd>
+ <dt>{{domxref("Event.isTrusted")}} {{readonlyinline}}</dt>
+ <dd>表示事件物件是否為瀏覽器建立（比如在用戶點擊之後），或由程式碼所建立（使用建立事件的方法，如 {{domxref("Event.initEvent()", "initEvent()")}}）。</dd>
+</dl>
+
+<h3 id="Obsolete_properties">Obsolete properties</h3>
+
+<dl>
+ <dt>{{domxref("Event.scoped")}} {{readonlyinline}} {{obsolete_inline}}</dt>
+ <dd>A {{jsxref("Boolean")}} indicating whether the given event will bubble across through the shadow root into the standard DOM. This property has been renamed to {{domxref("Event.composed", "composed")}}.</dd>
+</dl>
+
+<h2 id="方法" name="方法">方法</h2>
+
+<dl>
+ <dt>{{domxref("Event.createEvent()")}} {{deprecated_inline}}</dt>
+ <dd>
+ <p>Creates a new event, which must then be initialized by calling its <code>initEvent()</code> method.</p>
+ </dd>
+ <dt>{{domxref("Event.composedPath()")}}</dt>
+ <dd>Returns the event’s path (objects on which listeners will be invoked). This does not include nodes in shadow trees if the shadow root was created with its {{domxref("ShadowRoot.mode")}} closed.</dd>
+</dl>
+
+<dl>
+ <dt>{{domxref("Event.initEvent()")}} {{deprecated_inline}}</dt>
+ <dd>初始化已經建立的事件。若該事件已經被處理過，這方法就不會執行任何東西。</dd>
+ <dt>{{domxref("Event.preventDefault()")}}</dt>
+ <dd>取消該事件（如果該事件的 {{domxref("Event.cancelable", "cancelable")}} 屬性為 <code>true</code>）。</dd>
+ <dt>{{domxref("Event.stopImmediatePropagation()")}}</dt>
+ <dd>一旦事件物件呼叫此方法，目前元素中尚未執行的已註冊之相同事件類型監聽器將不會被呼叫，而事件也不會繼續捕捉或冒泡傳遞。</dd>
+ <dt>{{domxref("Event.stopPropagation()")}}</dt>
+ <dd>阻止事件物件繼續捕捉或冒泡傳遞。</dd>
+</dl>
+
+<h3 id="已廢棄方法">已廢棄方法</h3>
+
+<dl>
+ <dt>{{domxref("Event.getPreventDefault()")}} {{non-standard_inline}}</dt>
+ <dd>非標準方法。回傳 <code>defaultPrevented</code> 屬性值。請直接改用 {{domxref("Event.defaultPrevented", "defaultPrevented")}} 屬性。</dd>
+ <dt>{{domxref("Event.preventBubble()")}} {{non-standard_inline}} {{Obsolete_inline(24)}}</dt>
+ <dd>已廢棄方法。阻止事件繼續冒泡傳遞。請改用 {{domxref("event.stopPropagation()", "stopPropagation()")}} 方法。</dd>
+ <dt>{{domxref("Event.preventCapture()")}} {{non-standard_inline}} {{Obsolete_inline(24)}}</dt>
+ <dd>已廢棄方法。請改用 {{domxref("event.stopPropagation()", "stopPropagation()")}} 方法。</dd>
+</dl>
+
+<h2 id="規範">規範</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM WHATWG', '#interface-event', 'Event')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器相容性">瀏覽器相容性</h2>
+
+
+
+<p>{{Compat("api.Event")}}</p>
+
+<h2 id="See_also" name="See_also">參見</h2>
+
+<ul>
+ <li>可用的事件類型：<a href="/zh-TW/docs/Web/Reference/Events">Event reference</a></li>
+ <li><a href="/zh-TW/docs/Web/API/Event/Comparison_of_Event_Targets">各種 Event Targets 的比較</a> (target vs currentTarget vs relatedTarget vs originalTarget)</li>
+ <li><a href="/zh-TW/docs/Web/Guide/Events/Creating_and_triggering_events">建立和觸發事件</a></li>
+ <li>給 Firefox 插件開發者：
+  <ul>
+   <li><a href="/zh-TW/docs/Listening_to_events_in_Firefox_extensions">Listening to events in Firefox extensions</a></li>
+   <li><a href="/zh-TW/docs/Listening_to_events_on_all_tabs">Listening to events on all tabs</a></li>
+  </ul>
+ </li>
+</ul>
diff --git a/files/zh-tw/web/api/event/istrusted/index.html b/files/zh-tw/web/api/event/istrusted/index.html
new file mode 100644
index 0000000000..fe35fcc393
--- /dev/null
+++ b/files/zh-tw/web/api/event/istrusted/index.html
@@ -0,0 +1,107 @@
+---
+title: Event.isTrusted
+slug: Web/API/Event/isTrusted
+translation_of: Web/API/Event/isTrusted
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p>{{domxref("Event")}} 介面的 <code>isTrusted</code> 唯讀屬性為一個布林值，若事件物件是由使用者操作而產生，則 <code>isTrusted</code> 值為 <code>true</code>。若事件物件是由程式碼所建立、修改，或是透過 {{domxref("EventTarget.dispatchEvent()")}} 來觸發，則 <code>isTrusted</code> 值為 <code>false</code>。</p>
+
+<h2 id="Syntax" name="Syntax">語法</h2>
+
+<pre class="syntaxbox">var bool = event.isTrusted;
+</pre>
+
+<h2 id="範例">範例</h2>
+
+<pre> if (e.isTrusted) {
+     /* The event is trusted. */
+ } else {
+     /* The event is not trusted. */
+ }
+</pre>
+
+<h2 id="規範">規範</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM WHATWG', '#dom-event-istrusted', 'Event.isTrusted')}}</td>
+   <td>{{ Spec2('DOM WHATWG') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM3 Events', '#trusted-events', 'Trusted events')}}</td>
+   <td>{{Spec2('DOM3 Events')}}</td>
+   <td>Adds requirements regarding trusted and untrusted events, though it does not itself define the <code>isTrusted</code> property.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM4', '#dom-event-istrusted', 'Event.isTrusted')}}</td>
+   <td>{{Spec2('DOM4')}}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器相容性">瀏覽器相容性</h2>
+
+<div>{{CompatibilityTable}}</div>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome(46.0)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatNo}} [1]</td>
+   <td>{{CompatOpera(33)}}</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Android Webview</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>Firefox OS</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+   <th>Chrome for Android</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatChrome(46.0)}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatOperaMobile(33)}}</td>
+   <td>{{CompatNo}}</td>
+   <td>{{CompatChrome(46.0)}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<p>[1] In Internet Explorer, all events are trusted except those that are created with the <code>createEvent()</code> method.</p>
diff --git a/files/zh-tw/web/api/event/preventdefault/index.html b/files/zh-tw/web/api/event/preventdefault/index.html
new file mode 100644
index 0000000000..8553f5a23a
--- /dev/null
+++ b/files/zh-tw/web/api/event/preventdefault/index.html
@@ -0,0 +1,129 @@
+---
+title: Event.preventDefault()
+slug: Web/API/Event/preventDefault
+translation_of: Web/API/Event/preventDefault
+---
+<div>{{ ApiRef("DOM") }}</div>
+
+<div> </div>
+
+<h2 id="Summary" name="Summary">概要</h2>
+
+<p>如果事件可以被取消，就取消事件（即取消事件的預設行為）。但不會影響事件的傳遞，事件仍會繼續傳遞。</p>
+
+<h2 id="Syntax" name="Syntax">語法</h2>
+
+<pre class="syntaxbox"><em>event</em>.preventDefault();</pre>
+
+<h2 id="Example" name="Example">範例</h2>
+
+<p>Toggling a checkbox is the default action of clicking on a checkbox. This example demonstrates how to prevent that from happening:</p>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;preventDefault example&lt;/title&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+    &lt;p&gt;Please click on the checkbox control.&lt;/p&gt;
+    &lt;form&gt;
+        &lt;label for="id-checkbox"&gt;Checkbox&lt;/label&gt;
+        &lt;input type="checkbox" id="id-checkbox"/&gt;
+    &lt;/form&gt;
+    &lt;script&gt;
+        document.querySelector("#id-checkbox").addEventListener("click", function(event){
+            alert("preventDefault will stop you from checking this checkbox!")
+            event.preventDefault();
+        }, false);
+    &lt;/script&gt;
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+
+<p>You can see <code>preventDefault</code> in action <a class="internal" href="/samples/domref/dispatchEvent.html" title="samples/domref/dispatchEvent.html">here</a>.</p>
+
+<p>The following example demonstrates how invalid text input can be stopped from reaching the input field with preventDefault().</p>
+
+<div id="preventDefault_invalid_text">
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html&gt;
+&lt;head&gt;
+&lt;title&gt;preventDefault example&lt;/title&gt;
+
+&lt;script&gt;
+</pre>
+
+<pre class="brush: js">function Init () {
+    var myTextbox = document.getElementById('my-textbox');
+    myTextbox.addEventListener( 'keypress', checkName, false );
+}
+
+function checkName(evt) {
+    var charCode = evt.charCode;
+    if (charCode != 0) {
+        if (charCode &lt; 97 || charCode &gt; 122) {
+            evt.preventDefault();
+            alert(
+                "Please use lowercase letters only."
+                + "\n" + "charCode: " + charCode + "\n"
+            );
+        }
+    }
+}
+</pre>
+
+<pre class="brush: html">&lt;/script&gt;
+&lt;/head&gt;
+&lt;body onload="Init ()"&gt;
+    &lt;p&gt;Please enter your name using lowercase letters only.&lt;/p&gt;
+    &lt;form&gt;
+        &lt;input type="text" id="my-textbox" /&gt;
+    &lt;/form&gt;
+&lt;/body&gt;
+&lt;/html&gt;</pre>
+</div>
+
+<p>Here is the result of the preceding code:</p>
+
+<p>{{ EmbedLiveSample('preventDefault_invalid_text', '', '', '') }}</p>
+
+<h2 id="Notes" name="Notes">備註</h2>
+
+<p>Calling <code>preventDefault</code> during any stage of event flow cancels the event, meaning that any default action normally taken by the implementation as a result of the event will not occur.</p>
+
+<div class="note">
+<p><strong>Note:</strong> As of {{Gecko("6.0")}}, calling <code>preventDefault()</code> causes the {{ domxref("event.defaultPrevented") }} property's value to become <code>true</code>.</p>
+</div>
+
+<p>你可以查看 {{domxref("Event.cancelable")}} 屬性來檢查事件是否能夠被取消。對一個不能被取消的事件呼叫 <code>preventDefault()</code> 方法是沒有任何效果的。</p>
+
+<p><code>preventDefault()</code> 方法不會停止事件傳遞。若要停止事件繼續傳遞，可以使用 {{domxref("Event.stopPropagation()")}} 方法。</p>
+
+<h2 id="Specifications" name="Specifications">規範</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG', '#dom-event-preventdefault', 'Event.preventDefault()')}}</td>
+   <td>{{ Spec2('DOM WHATWG') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM4', '#dom-event-preventdefault', 'Event.preventDefault()')}}</td>
+   <td>{{ Spec2('DOM4') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events', '#Events-Event-preventDefault', 'Event.preventDefault()')}}</td>
+   <td>{{ Spec2('DOM2 Events') }}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>
diff --git a/files/zh-tw/web/api/event/stopimmediatepropagation/index.html b/files/zh-tw/web/api/event/stopimmediatepropagation/index.html
new file mode 100644
index 0000000000..8b08a441cc
--- /dev/null
+++ b/files/zh-tw/web/api/event/stopimmediatepropagation/index.html
@@ -0,0 +1,94 @@
+---
+title: Event.stopImmediatePropagation()
+slug: Web/API/Event/stopImmediatePropagation
+tags:
+  - API
+  - Event
+translation_of: Web/API/Event/stopImmediatePropagation
+---
+<p>{{APIRef("DOM")}}</p>
+
+<p>除了停止事件繼續捕捉或冒泡傳遞外，也阻止事件被傳入同元素中註冊的其它相同事件類型之監聽器。</p>
+
+<h2 id="Syntax" name="Syntax">語法</h2>
+
+<pre class="eval">event.stopImmediatePropagation();
+</pre>
+
+<h2 id="Notes" name="Notes">備註</h2>
+
+<p>如果一個元素中註冊了多個相同事件類型的監聽器，監聽器將會按照註冊的先後順序被呼叫。在其中任何一個監聽器執行的期間，若是呼叫了事件物件的 <code>stopImmediatePropagation()</code> 方法，則接下來尚未執行的監聽器皆不會被呼叫。</p>
+
+<h2 id="規範">規範</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG', '#dom-event-stopimmediatepropagation', 'Event.stopImmediatePropagation()')}}</td>
+   <td>{{Spec2('DOM WHATWG')}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM4', '#dom-event-stopimmediatepropagation', 'Event.stopImmediatePropagation()')}}</td>
+   <td>{{Spec2('DOM4')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器相容性">瀏覽器相容性</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatChrome("6.0")}}</td>
+   <td>{{CompatGeckoDesktop("10.0")}}</td>
+   <td>{{CompatIE(9.0)}}</td>
+   <td>{{CompatOpera("15.0")}}</td>
+   <td>{{CompatSafari("5.0")}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
diff --git a/files/zh-tw/web/api/event/stoppropagation/index.html b/files/zh-tw/web/api/event/stoppropagation/index.html
new file mode 100644
index 0000000000..652231306b
--- /dev/null
+++ b/files/zh-tw/web/api/event/stoppropagation/index.html
@@ -0,0 +1,63 @@
+---
+title: Event.stopPropagation()
+slug: Web/API/Event/stopPropagation
+tags:
+  - API
+  - DOM
+  - Event
+  - Method
+  - NeedsRewrite
+  - Reference
+translation_of: Web/API/Event/stopPropagation
+---
+<div>{{APIRef("DOM")}}</div>
+
+<p>{{domxref("Event")}} 介面的 <strong><code>stopPropagation()</code></strong> 方法可阻止當前事件繼續進行捕捉（capturing）及冒泡（bubbling）階段的傳遞。</p>
+
+<h2 id="語法">語法</h2>
+
+<pre class="syntaxbox"><em>event</em>.stopPropagation();</pre>
+
+<h2 id="範例">範例</h2>
+
+<p>請參考範例五：<a href="https://developer.mozilla.org/en-US/docs/DOM/DOM_Reference/Examples#Example_5:_Event_Propagation">事件傳遞</a>章節中關於此方法與 DOM 事件傳遞的更詳細範例。</p>
+
+<h2 id="規範">規範</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Specification</th>
+   <th>Status</th>
+   <th>Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM WHATWG", "#dom-event-stoppropagation", "Event.stopPropagation()")}}</td>
+   <td>{{Spec2("DOM WHATWG")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM4", "#dom-event-stoppropagation", "Event.stopPropagation()")}}</td>
+   <td>{{Spec2("DOM4")}}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName("DOM2 Events", "#Events-Event-stopPropagation", "Event.stopPropagation()")}}</td>
+   <td>{{Spec2("DOM2 Events")}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器相容性">瀏覽器相容性</h2>
+
+
+
+<p>{{Compat("api.Event.stopPropagation")}}</p>
+
+<h2 id="參見">參見</h2>
+
+<ul>
+ <li>See the <a href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-capture">DOM specification</a> for the explanation of event flow. (The <a href="http://www.w3.org/TR/DOM-Level-3-Events/#event-flow">DOM Level 3 Events draft</a> has an illustration.)</li>
+ <li>{{domxref("Event.preventDefault()")}} is a related method that prevents the default action of the event from happening.</li>
+</ul>
diff --git a/files/zh-tw/web/api/event/target/index.html b/files/zh-tw/web/api/event/target/index.html
new file mode 100644
index 0000000000..9599be68c7
--- /dev/null
+++ b/files/zh-tw/web/api/event/target/index.html
@@ -0,0 +1,134 @@
+---
+title: Event.target
+slug: Web/API/Event/target
+translation_of: Web/API/Event/target
+---
+<p>{{ApiRef("DOM")}}</p>
+
+<p>指向最初觸發事件的 DOM 物件。與 {{domxref("event.currentTarget")}} 屬性不同的是，<code>event.currentTarget</code> 屬性總會指向目前於冒泡或捕捉階段正在處理該事件之事件處理器所註冊的 DOM 物件，而 <code>event.target</code> 屬性則是永遠指向觸發事件的 DOM 物件。</p>
+
+<h2 id="語法">語法</h2>
+
+<pre class="syntaxbox">theTarget = event.target</pre>
+
+<h2 id="範例">範例</h2>
+
+<p>The <code>event.target</code> property can be used in order to implement <strong>event delegation</strong>.</p>
+
+<pre class="brush: js">// Make a list
+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 refers to the clicked &lt;li&gt; element
+  // This is different than e.currentTarget which would refer to the parent &lt;ul&gt; in this context
+  e.target.style.visibility = 'hidden';
+}
+
+// Attach the listener to the list
+// It will fire when each &lt;li&gt; is clicked
+ul.addEventListener('click', hide, false);
+</pre>
+
+<h2 id="規範">規範</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th>Specification</th>
+   <th>Status</th>
+   <th>Comment</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>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="瀏覽器相容性">瀏覽器相容性</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Edge</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<h2 id="Compatibility_notes">Compatibility notes</h2>
+
+<p>On IE 6-8 the event model is different. Event listeners are attached with the non-standard {{domxref('EventTarget.attachEvent')}} method. In this model, the event object has a {{domxref('Event.srcElement')}} property, instead of the <code>target</code> property, and it has the same semantics as <code>event.target</code>.</p>
+
+<pre class="brush: js">function hide(e) {
+  // Support IE6-8
+  var target = e.target || e.srcElement;
+  target.style.visibility = 'hidden';
+}
+</pre>
+
+<h2 id="參見">參見</h2>
+
+<ul>
+ <li><a href="/en-US/docs/Web/API/Event/Comparison_of_Event_Targets">Comparison of Event Targets</a></li>
+</ul>
diff --git a/files/zh-tw/web/api/event/timestamp/index.html b/files/zh-tw/web/api/event/timestamp/index.html
new file mode 100644
index 0000000000..3ec006a09e
--- /dev/null
+++ b/files/zh-tw/web/api/event/timestamp/index.html
@@ -0,0 +1,54 @@
+---
+title: Event.timeStamp
+slug: Web/API/Event/timeStamp
+translation_of: Web/API/Event/timeStamp
+---
+<div>{{ApiRef("DOM")}}</div>
+
+<h2 id="Summary" name="Summary">說明</h2>
+
+<p>回傳事件建立的時間（單位是毫秒；從 epoch 開始計算）。</p>
+
+<h2 id="Syntax" name="Syntax">Syntax</h2>
+
+<pre class="syntaxbox">event.timeStamp
+</pre>
+
+<h2 id="Examples" name="Examples">範例</h2>
+
+<pre><em>var number</em> = event.timeStamp;
+</pre>
+
+<p>下面是一個較為完整的範例：</p>
+
+<pre class="brush: html">&lt;html&gt;
+&lt;head&gt;
+
+&lt;title&gt;timeStamp example&lt;/title&gt;
+
+&lt;script type="text/javascript"&gt;
+function getTime(event) {
+  document.getElementById("time").firstChild.nodeValue = event.timeStamp;
+}
+&lt;/script&gt;
+&lt;/head&gt;
+
+&lt;body onkeypress="getTime(event)"&gt;
+
+&lt;p&gt;Press any key to get the current timestamp
+for the onkeypress event.&lt;/p&gt;
+&lt;p&gt;timeStamp: &lt;span id="time"&gt;-&lt;/span&gt;&lt;/p&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h2 id="Notes" name="Notes">注意</h2>
+
+<p>這個 property 僅在瀏覽器支持該事件才會有用。</p>
+
+<h2 id="Specification" name="Specification">詳細資料</h2>
+
+<ul>
+ <li><a class="external" href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113/events.html#Events-Event-timeStamp">timestamp </a></li>
+</ul>
diff --git a/files/zh-tw/web/api/event/type/index.html b/files/zh-tw/web/api/event/type/index.html
new file mode 100644
index 0000000000..12fcf0176d
--- /dev/null
+++ b/files/zh-tw/web/api/event/type/index.html
@@ -0,0 +1,97 @@
+---
+title: Event.type
+slug: Web/API/Event/type
+translation_of: Web/API/Event/type
+---
+<p>{{APIRef}}</p>
+
+<p><code><strong>Event.type</strong></code> 唯讀屬性會回傳一個代表此事件物件類型的字串。<code>Event.type</code> 屬性是於事件物件建立時被設定，而其屬性值－事件類型名稱也常被當作是特定的事件。</p>
+
+<p>傳至 {{ domxref("EventTarget.addEventListener()") }} 和 {{ domxref("EventTarget.removeEventListener()") }} 方法中，代表事件類型的參數 <em><code>event</code></em> 是不區分大小寫的。</p>
+
+<p>可用的事件類型，可參考 <a href="/zh-TW/docs/Web/Events" title="Mozilla event reference">event reference</a>。</p>
+
+<h2 id="Syntax" name="Syntax">語法</h2>
+
+<pre class="syntaxbox">event.type
+</pre>
+
+<h2 id="Example" name="Example">範例</h2>
+
+<pre class="brush: html">&lt;!DOCTYPE html&gt;
+&lt;html lang="en"&gt;
+&lt;head&gt;
+    &lt;meta charset="utf-8"&gt;
+
+    &lt;title&gt;Event.type Example&lt;/title&gt;
+
+    &lt;script&gt;
+        var currEvent = null;
+        function getEvtType(evt) {
+            console.log("//Start------------getEvtType(evt)------------ ");
+
+            currEvent = evt.type;
+            console.log(currEvent);
+
+            //document.getElementById("Etype").firstChild.nodeValue = currEvent;
+            document.getElementById("Etype").innerHTML = currEvent;
+
+            console.log("//End--------------getEvtType(evt)------------ ");
+        }
+
+        //Keyboard events
+        document.addEventListener("keypress", getEvtType, false); //[second]
+
+        document.addEventListener("keydown", getEvtType, false); //first
+        document.addEventListener("keyup", getEvtType, false); //third
+
+        //Mouse events
+        document.addEventListener("click", getEvtType, false); // third
+
+        document.addEventListener("mousedown", getEvtType, false); //first
+        document.addEventListener("mouseup", getEvtType, false); //second
+
+    &lt;/script&gt;
+&lt;/head&gt;
+
+&lt;body&gt;
+
+&lt;p&gt;Press any key or click the mouse to get the event type.&lt;/p&gt;
+&lt;p&gt;Event type: &lt;span id="Etype" style="color:red"&gt;-&lt;/span&gt;&lt;/p&gt;
+
+&lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+<h3 id="Result">Result</h3>
+
+<p>{{EmbedLiveSample('Example')}}</p>
+
+<h2 id="Specifications" name="Specifications">規範</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('DOM WHATWG', '#dom-event-type', 'Event.type')}}</td>
+   <td>{{ Spec2('DOM WHATWG') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM4', '#dom-event-type', 'Event.type')}}</td>
+   <td>{{ Spec2('DOM4') }}</td>
+   <td> </td>
+  </tr>
+  <tr>
+   <td>{{SpecName('DOM2 Events', '#Events-Event-type', 'Event.type')}}</td>
+   <td>{{ Spec2('DOM2 Events') }}</td>
+   <td>Initial definition.</td>
+  </tr>
+ </tbody>
+</table>