嵌入式

<button οnclick='alert("hello")'>点击按钮</button>

脚本模型

btn.onclick=function(){}


下面两种方法效果是一样的

  document.getElementById("target").onclick();

  document.getElementById("target").click(); 

备注：

btnObj.click()是真正地用程序去点击按钮，触发了按钮的 onclick（）事件

btnObj.onclick()只是简单地调用了btnObj的onclick所指向的方法，只是调用方法而已，并未直接触发事件

W3C事件写法

添加事件:appEventListener(事件名,事件函数,false )

btn.addEventListener('click',function(){},false);

btn.addEventListener('click',function(){},false);

移除事件:removeEventListener(事件名,事件函数名,false)

btn.removeEventListener('click',show,false )

第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。

事件冒泡或事件捕获

事件传递有两种方式：冒泡与捕获。

事件传递定义了元素事件触发的顺序。 如果你将

元素插入到

元素中，用户点击

元素, 哪个元素的 "click" 事件先被触发呢？

  • 在 冒泡 中，内部元素的事件会先被触发，然后再触发外部元素，即：

    元素的点击事件先触发，然后会触发

    元素的点击事件。

  • 在 捕获 中，外部元素的事件会先被触发，然后才会触发内部元素的事件，即：

    元素的点击事件先触发 ，然后再触发

    元素的点击事件。

    addEventListener(event, function, useCapture);

    默认值为 false, 即冒泡传递，当值为 true 时, 事件使用捕获传递。