javascript - 尝试创建一个脚本，当我将鼠标悬停在特定元素上时，该脚本将在特定元素周围创建边框

Question

我想创建一个脚本，当我将鼠标悬停在特定元素上时，它会在特定元素周围创建边框

我尝试使用的代码..

(function(){
  $(document.body).each(function(){
$(this).hover(
    function(){
        $(this).css('border','1px solid blue');

    },
    function(){
        $(this).css('border','none');
    }
)
  })
})()

任何帮助将不胜感激

Answer 1

使用delegate只需将mouseover/mouseout事件附加到body标签，而不是将其附加到页面上的所有元素。使用this我们可以控制CSS。

注意:此方法仅在 body 元素上附加一个事件处理程序。

$(function(){
  $('body').delegate("*", 'mouseover', function(e){
                $(this).css('border','1px solid blue');
                e.stopPropagation();

            }).delegate("*", 'mouseout', function(e){
                $(this).css('border','none');
                e.stopPropagation();
            }
        );

});

工作中demo