上代碼
<button id="button" >click</button>
<script>
let button = document.querySelector("#button");
button.addEventListener("click", () => {
Promise.resolve().then(() => console.log("promise1"));
console.log("click1");
});
button.addEventListener("click", () => {
Promise.resolve().then(() => console.log("promise2"));
console.log("click2");
});
button.click();
</script>
執(zhí)行結(jié)果如下
當(dāng) click 觸發(fā)的事件時(shí)压鉴,會(huì)和點(diǎn)擊的觸發(fā)不相同
click事件過程
點(diǎn)擊事件過程
經(jīng)過一系列排查發(fā)現(xiàn)
由click 和dispatchEvent等DOM 模擬生成的事件是不可信的暇矫,不由瀏覽器調(diào)度秦驯。
查閱事件流等文檔個(gè)人得出結(jié)論贡翘,用戶觸發(fā)的可信事件會(huì)由瀏覽器調(diào)度,按照定義事件的順序執(zhí)行呈础,而事件內(nèi)由特定的進(jìn)程驅(qū)動(dòng)毡惜,會(huì)將微任務(wù)放在下一個(gè)事件觸發(fā)之前執(zhí)行。
3.3事件可以同步或異步調(diào)度瞬铸。
同步事件(同步事件)被視為先進(jìn)先出模型中的虛擬隊(duì)列批幌,按照相對于其他事件、DOM變化和用戶交互的時(shí)間發(fā)生順序進(jìn)行排序嗓节。此虛擬隊(duì)列中的每個(gè)事件都會(huì)被延遲荧缘,直到前一個(gè)事件完成其傳播行為或被取消。有些同步事件是由特定的設(shè)備或進(jìn)程驅(qū)動(dòng)的拦宣,例如鼠標(biāo)按鈕事件截粗。這些事件由為該組事件定義的事件順序算法控制,用戶代理將按定義的順序調(diào)度這些事件鸵隧。
異步事件(async events)可以在動(dòng)作結(jié)果完成時(shí)調(diào)度绸罗,與其他事件、DOM中的其他更改以及用戶交互無關(guān)豆瘫。
3.4.可信事件
由用戶代理生成的事件从诲,無論是作為用戶交互的結(jié)果,還是作為對DOM進(jìn)行更改的直接結(jié)果靡羡,都由用戶代理信任系洛,用戶代理擁有腳本通過createEvent()方法生成的事件所不具備的權(quán)限,可以使用initEvent()方法進(jìn)行修改略步,也可以通過dispatchEvent()方法進(jìn)行調(diào)度描扯。受信任事件的受信任屬性的值為真,而不受信任事件的受信任屬性值為假趟薄。
除了點(diǎn)擊事件之外绽诚,大多數(shù)不受信任的事件不會(huì)觸發(fā)默認(rèn)操作。此事件始終會(huì)觸發(fā)默認(rèn)操作杭煎,即使isTrusted屬性為false(保留此行為是為了向后兼容)恩够。所有其他不受信任的事件的行為就像對該事件調(diào)用了preventDefault()方法一樣。