Does document.body.innerHTML = "" очистить веб-страницу?

Когда я обновляю страницу ниже в FF 3.0, я ожидал, что веб-страница будет очищена, но это не так.

Почему document.body.innerHTML = "" не удаляет страницу?

UPDATE: Я пытаюсь очистить предыдущий экран во время обновления во время загрузки новой страницы. На самом деле я хочу, чтобы страница была очищена, подождите, а затем запускается следующий 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>

Ответы

Ответ 1

document.body.innerHTML = ''; очищает body, да. Но он очищает innerHTML, как это происходит в момент запуска кода. Когда вы запускаете код до того, как изображения и script на самом деле находятся в body, он пытается очистить body, но ничего не очистить.

Если вы хотите очистить body, вам нужно запустить код после того, как body будет заполнено содержимым. Вы можете сделать это, поставив блок <script> в качестве последнего дочернего элемента body, поэтому все загружается до запуска кода или вам нужно каким-то образом прослушать событие dom:loaded.

Ответ 2

Чтобы изложить ответ Douwem, в тэге script поместите свой код в onload:

<script type="text/javascript">
    window.onload=function(){
       document.body.innerHTML = "";
    }
</script>

Ответ 3

Соглашаясь с ответами Дуэ Маана и Эрика, здесь есть несколько других вещей, которые могут вам пригодиться.

Во-первых, в ваших тегах заголовка вы можете ссылаться на отдельный файл JavaScript, который затем можно использовать повторно:

<script language="JavaScript" src="/common/common.js"></script>

где common.js - ваш многократно используемый файл функции в каталоге верхнего уровня, называемом common.

Во-вторых, вы можете задержать работу script с помощью setTimeout, например:

setTimeout(someFunction, 5000);

Второй аргумент - в миллисекундах. Я упоминаю об этом, потому что вы пытаетесь задержать что-то в своем исходном фрагменте кода.

Ответ 4

Как говорили другие, простое решение - поместить ваш скрипт внизу страницы, потому что все элементы DOM загружаются синхронно сверху вниз. В противном случае, я думаю, что вы ищете document.onload(() => {callback_body}) или window.onload(() => {callback_body}), как сказал Эрик. Это позволяет вам выполнить сценарий, когда происходит событие dom:loaded, как сказал Доу Маан. Не уверен насчет свойств window.onload, но document.onload запускается только после загрузки всех элементов, css и скриптов. В вашем случае:

<script type="text/javascript">
    document.onload(() =>
        document.body.innerHTML = "";
    )
</script>

или, если вы используете старый браузер:

<script type="text/javascript">
    document.onload(function() {
        document.body.innerHTML = "";
    })
</script>

Ответ 5

Я не уверен, чего вы пытаетесь достичь, но вы можете рассмотреть возможность использования jQuery, который позволяет помещать ваш код в главный тег или отдельный файл script и все еще иметь код, выполняемый после DOM загружен.

Затем вы можете сделать что-то вроде:

$(document).ready(function() {
$(document).remove();
});

а также выборочное удаление элементов (все DIV, только DIV с определенными классами и т.д.)

Ответ 6

Я очищаю свой экран, используя функцию, которая

var clear_body = function (){
    var lista = document.body.childNodes;
    for (var i = lista.length - 1; i >= 0 ;i--){
        document.body.removeChild(lista[i])
    }
}