jQuery - 通过event.target属性获取元素的类

Question

我有以下代码:

    <script type="text/javascript">
       $("*").click(function(event){
         var x = event.target;

         if (x.nodeName == "DIV"){                  
           alert(x.attr("class"));
         }

       })
    </script>

这将引发"未定义"例外...是否有任何其他方式来获取类引发的"click"事件的元素？先感谢您!

Answer 1

event.target是一个DOM对象.因此,要使用jQuery方法,您必须将其转换为jQuery对象:

alert($(x).attr("class"));

否则,您可以使用property className来获取元素的类:

alert(x.className);

顺便说一句,在您的示例中,您可以简单地使用this关键字而不是event.target.

Answer 2

jQuery 提供了一些语法糖来帮助您进行检查 -.is()允许您根据任何其他有效选择器验证元素：

var $target = event.target;
if ($target.is('div')){
  alert($target.attr('class'));
}

还有一些进一步的变化需要考虑：

• .click(handler)被显式分配给匹配元素（您的情况中的每个元素）。这增加了开销；该处理程序也不会应用于执行处理程序分配后动态添加的任何元素。相反，使用委托处理程序on()
• 重构你的逻辑，这样你就可以通过将选择器更改为仅适用于 div，而不是处理每次单击并验证它$('div')
• 依赖this这几乎是惯例

经过所有这些更改后，代码变得更小且更具可读性：

$('div').on('click', function() {
  alert($(this).attr('class'));
});