Dom相关事件的执行顺序

dom_load_order.user.js

// ==UserScript==
// @name         New Userscript
// @namespace    https://github.com/ipcjs
// @version      0.0.1
// @description  try to take over the world!
// @author       ipcjs
// @match        http://bangumi.bilibili.com/anime/5788/play*
// @grant        none
// @run-at       document-start
// ==/UserScript==

(function () {
    'use strict';
    window.addEventListener('load', (...args) => {
        console.log(7, document.readyState, args, document.getElementById('index_nav'));
    });
    window.addEventListener('DOMContentLoaded', (...args) => {
        console.log(5, document.readyState, args, document.getElementById('index_nav'));
    });
    document.addEventListener('readystatechange', (...args) => {
        console.log(1, document.readyState, args, document.getElementById('index_nav'));
    });
    document.addEventListener('DOMContentLoaded', (...args) => {
        console.log(3, document.readyState, args, document.getElementById('index_nav'));
    });

    document.addEventListener('DOMContentLoaded', (...args) => {
        console.log(4, document.readyState, args, document.getElementById('index_nav'));
    });

    window.addEventListener('DOMContentLoaded', (...args) => {
        console.log(6, document.readyState, args, document.getElementById('index_nav'));
    });
    document.addEventListener('readystatechange', (...args) => {
        console.log(2, document.readyState, args, document.getElementById('index_nav'));
    });

    window.addEventListener('load', (...args) => {
        console.log(8, document.readyState, args, document.getElementById('index_nav'));
    });
})();