jquery的live实现原理

将事件绑定到父节点,由于事件冒泡，所有事件最终会冒泡到 document 节点当有事件触发时，则判断事件类型和触发事件的元素是否一致，如果相同则执行函数

function live(target, type, fn) {
  //元素类型，事件类型，执行函数
  document.onclick = function (event) {
    var e = event ? event : window.event
    addRow()
    if (e.type == type && e.target.tagName.toLocaleLowerCase() == target) {
      fn() //如果元素类型和事件类型同时匹配,则执行函数
    }
  }
}
function addRow() {
  var x = document.getElementById('tb').insertRow(0)
  var y = x.insertCell(0)
  var z = x.insertCell(1)
  y.innerHTML = 'NEW CELL1'
  z.innerHTML = 'NEW CELL2'
}

//实例:将所有的td(包括后续js添加的)绑定click事件
live('td', 'click', function () {
  alert('live')
})

参考资料

jquery live()函数原理及实现

jquery的live实现原理 #

参考资料 #

jquery的live实现原理

参考资料