# event.target

所属分类：事件 > 事件对象 英文文档：event.target

## event.target 返回: Element

描述: 触发事件的DOM元素。

- #### 添加的版本: 1.0event.target

`target` 属性可以是注册事件时的元素，或者它的子元素。通常用于比较 `event.target` 和 `this` 来确定事件是不是由于冒泡而触发的。经常用于事件冒泡时处理事件委托。

## 例子:

#### Example: 显示点击元素的标签名。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
    <!DOCTYPE html><html><head>  <style>span, strong, p {  padding: 8px; display: block; border: 1px solid #999;  }    </style>  <script src="https://code.jquery.com/jquery-latest.js"></script></head><body> <div id="log"></div><div>  <p>    <strong><span>click</span></strong>  </p></div><script>$("body").click(function(event) {  $("#log").html("clicked: " + event.target.nodeName);});  </script> </body></html>

#### Demo:

#### Example: 实现一个简单的事件委托：给无序列表增加一个点击事件处理函数，然后它的子元素li的子元素都隐藏起来。当点击这个ul其中一个子元素li的时候，来回切换显示（参见 toggle()）li的子元素。

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
    <!DOCTYPE html><html><head>  <script src="https://code.jquery.com/jquery-latest.js"></script></head><body> <ul>  <li>item 1    <ul>      <li>sub item 1-a</li>      <li>sub item 1-b</li>    </ul>  </li>  <li>item 2    <ul>      <li>sub item 2-a</li>      <li>sub item 2-b</li>    </ul>  </li></ul><script>function handler(event) {  var $target = $(event.target);  if( $target.is("li") ) {    $target.children().toggle();  }}$("ul").click(handler).find("ul").hide();</script> </body></html>

#### Demo: