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

Question

我有以下代码：

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

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

       })
    </script>

这会引发“未定义”异常......有没有其他方法可以获取触发“点击”事件的元素的类？先感谢您！

Answer 1

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

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

否则，您可以使用属性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')
• 依靠this哪个几乎是惯例

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

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