Javascript document.body.innerHTML = "" 是否清除网页？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2250589/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Does document.body.innerHTML = "" clear the web page?
提问by Tony_Henrich
When I refresh the page below in FF 3.0, I expected the web page to clear but it didn't.
当我在 FF 3.0 中刷新下面的页面时，我希望网页可以清除，但它没有。
Why doesn't document.body.innerHTML = ""clear the page?
为什么不document.body.innerHTML = ""清除页面？
UPDATE:I am trying to clear the previous screen during a refresh while the new page is loading. I actually want to see the page clear, wait and then the next js running. I don't want to clear the screen after the page has loaded.
更新：我试图在加载新页面的刷新过程中清除上一个屏幕。我实际上想看到页面清晰，等待然后下一个 js 运行。我不想在页面加载后清除屏幕。
...
<body>
<script type="text/javascript">
document.body.innerHTML = "";
for (var i = 0; i < 1000000000; i++) {
}
</script>
<img src="images/web.gif" /><br />
<script type="text/javascript">
document.write( "hello<br />");
</script>
<img src="images/warning.png" /><br />
</body>
回答by Douwe Maan
document.body.innerHTML = '';does clear the body, yeah. But it clears the innerHTMLas it is at the moment the code is ran. As you run the code before the images and the script are actually in the body, it tries to clear the body, but there's nothing to clear.
document.body.innerHTML = '';确实清除了body，是的。但它会清除innerHTML代码运行时的原样。当您在图像和脚本实际位于 之前运行代码时body，它会尝试清除body，但没有什么可清除的。
If you want to clear the body, you have to run the code after the bodyhas been filled with content. You can do this by either placing the <script>block as the last child of body, so everything is loaded before the code is ran, or you have to use some way to listen to the dom:loadedevent.
如果要清除body，则body必须在填充内容后运行代码。您可以通过将<script>块作为 的最后一个子项来完成此操作body，以便在运行代码之前加载所有内容，或者您必须使用某种方式来侦听dom:loaded事件。
回答by Erik
To expound on Douwem's answer, in your script tag, put your code in an onload:
为了阐述 Douwem 的回答，在你的脚本标签中，将你的代码放在一个 onload 中：
<script type="text/javascript">
window.onload=function(){
document.body.innerHTML = "";
}
</script>
回答by Rich Harding
Whilst agreeing with Douwe Maan and Erik's answers, there are a couple of other things here that you may find useful.
虽然同意 Douwe Maan 和 Erik 的回答，但这里还有一些其他东西可能对您有用。
Firstly, within your head tags, you can reference a separate JavaScript file, which is then reusable:
首先，在你的 head 标签中，你可以引用一个单独的 JavaScript 文件，然后可以重用：
<script language="JavaScript" src="/common/common.js"></script>
where common.js is your reusable function file in a top-level directory called common.
其中 common.js 是名为 common 的顶级目录中的可重用函数文件。
Secondly, you can delay the operation of a script using setTimeout, e.g.:
其次，您可以使用 setTimeout 延迟脚本的操作，例如：
setTimeout(someFunction, 5000);
The second argument is in milliseconds. I mention this, because you appear to be trying to delay something in your original code snippet.
第二个参数以毫秒为单位。我提到这一点是因为您似乎试图延迟原始代码片段中的某些内容。
回答by ThisGuyCantEven
As others were saying, an easy solution is to put your script at the bottom of the page, because all DOM elements are loaded synchronously from top to bottom. Otherwise, I think what you're looking for is document.onload(() => {callback_body})or window.onload(() => {callback_body})as Erik said. These allow you to execute you script when the dom:loadedevent is fired as Douwe Maan said. Not sure about the properties of window.onload, but document.onloadis triggered only after all elements, css, and scripts are loaded. In your case:
正如其他人所说，一个简单的解决方案是将您的脚本放在页面底部，因为所有 DOM 元素都是从上到下同步加载的。否则，我认为您正在寻找的是document.onload(() => {callback_body})或window.onload(() => {callback_body})正如埃里克所说。dom:loaded正如 Douwe Maan 所说，这些允许您在事件被触发时执行脚本。不确定 的属性window.onload，但document.onload只有在加载所有元素、css 和脚本后才会触发。在你的情况下：
<script type="text/javascript">
document.onload(() =>
document.body.innerHTML = "";
)
</script>
or, If you are using an old browser:
或者，如果您使用的是旧浏览器：
<script type="text/javascript">
document.onload(function() {
document.body.innerHTML = "";
})
</script>
回答by Andy Shellam
I'm not sure what you're trying to achieve, but you may want to consider using jQuery, which allows you to put your code in the head tag or a separate script file and still have the code executed after the DOM has loaded.
我不确定您想要实现什么，但您可能需要考虑使用 jQuery，它允许您将代码放在 head 标记或单独的脚本文件中，并且在 DOM 加载后仍然执行代码。
You can then do something like:
然后，您可以执行以下操作：
$(document).ready(function() {
$(document).remove();
});
as well as selectively removing elements (all DIVs, only DIVs with certain classes, etc.)
以及有选择地删除元素（所有 DIV，仅具有某些类的 DIV 等）
回答by Miguel Villamizar
I clear my screen using is function that
我使用的是功能清除我的屏幕
var clear_body = function (){
var lista = document.body.childNodes;
for (var i = lista.length - 1; i >= 0 ;i--){
document.body.removeChild(lista[i])
}
}
