[JavaScript知识库]今日学习打卡——jQuery之on()的优势

1. ?对于单个元素注册事件分开写比较麻烦

$("p").click(function(){
  $(this).hide();
});
$("p").mouseenter(function(){
  $(this).css("background","blue");
});

所以可以通过on来一次性注册多个事件

$("p").on({
  click:function(){
    $(this).hide();
  },
  mouseenter:function(){
    $(this).css("background","blue");
  }
});

//还可以合并
$("div").on( "mouseenter mouseleave", function(){
    $(this).toggleclass( "current");
})

2. 事件委托

$("ul").on("click", "li", function() {
    alert(11);
});
// click是绑定在ul身上的，但是触发的对象是ul里的li

3.给未来动态创建的元素绑定事件

$("ol").on( "click", "li", function() {
    alert(11);
})
var li = $("<li>我是后来创建的</li>");
$("ol").append(li);
})