webentwicklung-frage-antwort-db.com.de

Löscht document.body.innerHTML = "" die Webseite?

Beim Aktualisieren der folgenden Seite in FF 3.0 habe ich erwartet, dass die Webseite gelöscht wird, dies war jedoch nicht der Fall.

Warum nicht document.body.innerHTML = "" Seite löschen?

PDATE: Ich versuche, den vorherigen Bildschirm während einer Aktualisierung zu löschen, während die neue Seite geladen wird. Ich möchte eigentlich die Seite klar sehen, warten und dann das nächste js laufen. Ich möchte den Bildschirm nicht löschen, nachdem die Seite geladen wurde.

...
<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>
26
Tony_Henrich

document.body.innerHTML = ''; löscht das body, ja. Aber es löscht das innerHTML so wie es ist, wenn der Code ausgeführt wird. Wenn Sie den Code ausführen, bevor sich die Bilder und das Skript tatsächlich im body befinden, wird versucht, das body zu löschen, es ist jedoch nichts zu löschen.

Wenn Sie body löschen möchten, müssen Sie den Code ausführen, nachdem body mit Inhalt gefüllt wurde. Sie können dies tun, indem Sie entweder das <script> als letztes Kind von body blockieren, also wird alles geladen, bevor der Code ausgeführt wird, oder Sie müssen die dom:loaded Veranstaltung.

44
Douwe Maan

Um die Antwort von Douwem zu erläutern, fügen Sie Ihren Code in Ihr Skript-Tag ein:

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

Während Sie den Antworten von Douwe Maan und Erik zustimmen, gibt es hier einige andere Dinge, die Sie vielleicht nützlich finden.

Erstens können Sie in Ihren Head-Tags auf eine separate JavaScript-Datei verweisen, die dann wiederverwendet werden kann:

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

dabei ist common.js Ihre wiederverwendbare Funktionsdatei in einem Verzeichnis der obersten Ebene mit dem Namen common.

Zweitens können Sie die Ausführung eines Skripts mit setTimeout verzögern, z.

setTimeout(someFunction, 5000);

Das zweite Argument ist in Millisekunden. Ich erwähne dies, weil Sie anscheinend versuchen, etwas in Ihrem ursprünglichen Code-Snippet zu verzögern.

3
Rich Harding

Wie andere bereits sagten, ist es eine einfache Lösung, Ihr Skript am Ende der Seite einzufügen, da alle DOM-Elemente synchron von oben nach unten geladen werden. Ansonsten denke ich, was Sie suchen, ist document.onload(() => {callback_body}) oder window.onload(() => {callback_body}), wie Erik sagte. Hiermit können Sie Ihr Skript ausführen, wenn dom:loaded Ereignis wird ausgelöst, wie Douwe Maan sagte. Nicht sicher über die Eigenschaften von window.onload, aber document.onload wird erst ausgelöst, nachdem alle Elemente, CSS und Skripte geladen wurden. In deinem Fall:

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

Ich bin mir nicht sicher, was Sie erreichen möchten, aber Sie sollten möglicherweise die Verwendung von jQuery in Betracht ziehen, mit dem Sie Ihren Code in das head-Tag oder eine separate Skriptdatei einfügen und den Code auch nach dem Laden des DOM ausführen können.

Sie können dann Folgendes tun:

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

sowie selektives Entfernen von Elementen (alle DIVs, nur DIVs mit bestimmten Klassen usw.)

0
Andy Shellam