在页面加载时更改 HTML DOM

Question

我想在页面上的 DOM 中编辑某些节点的内容，但是如果我使用

window.onload

来编辑它，那么只有在加载 full 页面后才能完成，并且可以看到节点的内容发生了变化。

那么，有没有办法在页面加载时但在向用户显示之前编辑某些节点的内容？

Answer 1

是的，有。您可以使用

display: none;

并在页面加载时更改它。喜欢：

window.addEventListener("load", function() {
    let item = document.getElementById("myitem");
    item.innerText = "fully loaded";
    item.style.backgroundColor = "green";
    item.style.display = "block";
});

#myitem {
    border: 1px solid black;
    width: 100px;
    height: 100px;
    display: none;
}

<div id="myitem">loading...</div>

只需确保您不想显示的内容具有

display: none;

，然后在适当的时候（即页面加载时）进行更改。