2008-12-15 11 views
6

Betrachten wir zwei Web-Seiten mit dem folgenden in ihrem Körper jeweils:document.write() vs Einfügen von DOM-Knoten: Formularinformationen erhalten?

<body> 
<script> 
document.writeln('<textarea></textarea>') 
</script> 
</body> 

und

<body> 
<script> 
var t = document.createElement('textarea'); 
document.body.appendChild(t); 
</script> 
</body> 

(denken Sie an sie als Teil von etwas Größerem, wo die Textbereiche haben von JavaScript generiert werden und kann nicht hart in die Seite kodiert werden). Beide produzieren die gleiche Leistung, aber ersteres gilt als "schlecht", während letzteres als "richtiger" Weg angesehen wird. (Rechts?)

Auf der anderen Seite, wenn Sie etwas auf der Seite eingeben und dann entweder aktualisieren, oder gehen Sie woanders und drücken Sie Zurück, dann im ersten Fall, was Sie in der Textfläche eingegeben hat, während erhalten im späteren ist es verloren. (Mindestens bei Firefox.) Gibt es eine Möglichkeit, die letztere Methode zu verwenden und dennoch die nützliche Funktion zu haben, dass das, was der Benutzer in ein Formular eingegeben hat, auch dann gespeichert wird, wenn er versehentlich auf Aktualisieren klickt oder über die Zurück-Schaltfläche zurückkommt (zumindest bei Firefox)?

+0

Ich habe gerade versucht, eine ID und einen Namen hinzuzufügen, und es hat nicht geholfen. Ich kann es von beiden verschwinden lassen, wenn ich stattdessen insertBefore (t, document.body.firstChild) verwende. – some

+0

Was ärgerlich ist, ist, dass die Arbeit des Benutzers sollte die * Standard * in jedem guten Browser sein, nicht etwas, das nur mit nicht-Standard-Hacks funktioniert. – ShreevatsaR

Antwort

5

Ich glaube, dass die document.write-Version tatsächlich einen vorhandenen Inhalt auf der Seite wegbläst. Das heißt, die Body- und Script-Tags werden nicht mehr da sein. Deshalb verwenden Leute normalerweise appendChild.

Das Behalten des Textes oder nicht ist sehr Browser spezifisch. Ich würde nicht wetten, dass Firefox sein Verhalten auch in einer zukünftigen Version nicht ändern würde. Ich würde vorschlagen, einen Warndialog zu implementieren, wenn der Benutzer versucht, sich von der Seite weg zu bewegen, und in Bearbeitungsfeldern noch nicht gespeicherter Inhalt vorhanden ist. Normalerweise würden Sie dies mit einem Entladevorgang tun.

+0

Nein, das stimmt nicht. document.write() fügt sich gerne an den vorhandenen Inhalt auf der Seite an. – ShreevatsaR

+2

Eigentlich wird es, wenn Sie nicht in der ersten Onload der Seite sind. Wenn Sie es später tun, sagen Sie, wenn ein Ajax-Anruf zurückkehrt, wird die Seite gelöscht. –

+0

Chase Seibert ist korrekt, dass es die Seite löscht, wenn sie nach dem Laden der Seite aufgerufen wird. – some

0

Wäre es möglich, dass Sie einen Hook hinzufügen, mit dem Sie das neue Textfeld eingrenzen können? z.B. ein <div>

<div id="addtextarea"></div> 

var e = document.getElementByID('addtextarea'); 
e.innerHTML = '<textarea></textarea>'; 

Dann, wenn Sie die Inhalte zu erinnern, benötigt man entweder den innerHTML- Wert gehören die HTML oder einfach nur den Text Knotenwert des TextArea- nehmen könnte den Text zu extrahieren.

4

document.write() blättert den Seiteninhalt nicht weg, solange er inline ausgeführt wird, während die Seite gerendert wird. Online-Werbung nutzt document.write(), um Anzeigen dynamisch in die Seite zu schreiben, während sie geladen wird.

Wenn Sie jedoch die Methode document.write() zu einem späteren Zeitpunkt in der Seitenhistorie ausgeführt haben (nachdem der Text vollständig gerendert wurde), würde Chase den vorhandenen Text wegblasen und das zu dokumentierende Argument anzeigen .schreiben().

Abgesehen davon, stimme ich zu, dass das Verhalten der konservierenden Formulare wirklich ziemlich Browser-spezifisch ist, und nicht etwas, auf das Sie sich in vielen Fällen verlassen sollten. Es ist ein Feature, das dem Benutzer hilft und nicht etwas, das Entwickler kennen oder versuchen zu nutzen.

0

Normalerweise bevorzuge ich es, ein DOM-Element zu erstellen und es einzufügen - besonders, da ich es genau dort einfügen kann, wo ich es möchte (zB object.appendChild oder body.appendChild). Es spielt auch keine Rolle, ob die Einfügung während des Ladens der Seite oder später erfolgt, also kann ich eine verallgemeinerte Einfügefunktion verwenden und sie jederzeit, während oder nach dem vollständigen Laden der Seite verwenden.

Wenn Sie jedoch während des Ladevorgangs Inhalte einfügen, die Javascript enthalten (d. H. SCRIPT-Typ = "text/javascvript" .../SCRIPT-Sequenz), MÜSSEN Sie das Dokument verwenden.schreibe, um das Skript ausführen zu lassen.

  • Mit document.body.appendChild (theInsertionObject) ordnungsgemäß die Insertion an dem aktuellen Punkt im Ladevorgang einschließlich der SCRIPT-Tag-Sequenz hinzuzufügen, aber es wird die JavaScript nicht ausführen.

  • Wenn Sie document.write (theInsertionCode), wird der Code am aktuellen Punkt im Ladevorgang eingeführt werden, und jede eingebetteten SCRIPT-Tag-Sequenz wird, bevor der Rest der Seite ausgeführt wird geladen wird.