运用场景
一是触发自定义事件,浏览器自带事件一般由浏览器接收某些操作之后触发,而自定义事件的触发就需要使用dispatchEvent来进行手动触发了。
二是触发浏览器标准事件。根据需求决定,某些操作如果正好与某个元素事件的触发一致,且该事件很好模拟,我们就可以触发该事件来达到某些我们需要的执行结果。
<div id="div"></div>
<script>
var elem = document.querySelector('#div');
elem.addEventListener("myEvent", function(e) { console.log(e.detail) });
var event = new CustomEvent("myEvent", {"detail":{"username":123}});
elem.dispatchEvent(event);
</script>
结果输出:{username: 123}