Question

我已阅读了很多相关问题，下面给出了列表，但似乎没有一个适用于我的情况。

我希望元素周围出现边框。我尝试了下面的代码，但$（“*”）选择层次结构中的所有元素，边框也出现在父元素周围，这不是我想要的。我想只选择点击的元素，而不是选择父母元素。

这是脚本

$( "*" ).each(function(){ 
    $(this).on( "mousedown", function(){
        $(this).css("border", "1px solid red");
    }); 

$(this).on( "mouseup", function(){
        $(this).css("border-style", "none");
    });
});

以下列出了我的一些“不太有用”的研究： - javascript - Best Way to Get All DOM Elements with jQuery

jquery get all form elements: input, textarea & select

All Selector (“*”) | jQuery API Documentation

Answer 1

使用*选择器是非常低效的，因为它为 DOM中的每个元素添加了一个事件处理程序。您可以使用事件传播来执行此操作，方法是将事件处理程序放在document上，并使用target属性引用触发事件的元素。试试这个：

$(document).mousedown(function(e) {
    $(e.target).css('border', '1px solid red');
}).mouseup(function(e) {
    $(e.target).css('border', '0');
});

Example fiddle

jQuery：对页面上的每个元素执行相同的操作

1 个答案: