瀏覽器中js操作DOM 與其他JS代碼執(zhí)行順序

如下代碼：

document.querySelector(".div-bgd").style.display = "block";
document.querySelector(".load_div").style.display = "block";
console.log(1)
alert(1)

瀏覽器運行環(huán)境中，為何是先執(zhí)行 console 和 alert 語句，而不是先執(zhí)行前面兩個樣式改變的語句呢?
例子見下：
codepen