Das ist im Allgemeinen die Art und Weise, wie ich die progressive Verbesserung bewältige, während ich die Erfahrung sauber halte, aber wie sicher ist sie? Gibt es Potenzial für eine Race Condition und das funktioniert nicht?
Stellen Sie sich das einfache abstrakte Szenario vor, Sie möchten etwas anderes anzeigen, wenn Sie JavaScript-Unterstützung haben. Das ist im Allgemeinen, was ich am Ende tun werde:
%Vor%Viele behaupten, Sie sollten ein Framework verwenden und auf ein domready-Ereignis warten und dort Änderungen vornehmen. Es gibt jedoch eine erhebliche Verzögerung, bei der das Element 'test' bereits vor dem Ende des Dokuments und der css gerendert wurde sind bereit und ein domready löst aus .. und verursacht so ein merkliches flackern von 'original'.
Ist dieser Code anfällig für Fehler bei Rennen? oder kann ich garantieren, dass ein Element erkennbar und modifizierbar ist, wenn es vor dem Skript existiert?
Vielen Dank im Voraus.
Das können Sie, aber es gibt Probleme damit.
Zuallererst, in IE, wenn Sie versuchen, einen Knoten zu manipulieren, der nicht geschlossen wurde (zB BODY vor seinem close-Tag, der unter Ihrem JS liegen sollte), dann können Sie den IE "OPERATION ABORTED" -Fehler finden, der zu einem Leerzeichen führt Seite. Die Manipulation eines Knotens umfasst das Anhängen von Knoten, Verschieben von Knoten usw.
In anderen Browsern ist das Verhalten nicht definiert, sie verhalten sich jedoch normalerweise wie erwartet. Das Hauptproblem ist, dass die Seite während der Entwicklung Ihrer Seite möglicherweise anders geladen / analysiert / ausgeführt wird. Dies kann dazu führen, dass ein Skript ausgeführt wird, bevor ein Browser definiert, dass referenzierte Elemente tatsächlich erstellt und für die DOM-Manipulation verfügbar gemacht wurden.
Wenn Sie versuchen, die vom Benutzer wahrgenommene Leistung (d. h. Schnippeln) zu verbessern. Ich schlage vor, dass Sie diesen Weg vermeiden und Ihre Seiten blitzschnell beleuchten. Sie können Yahoos YSlow / Googles Page Performance Firebug verwenden, um Ihnen den Einstieg zu erleichtern.
Sie können das DOM vor dem vollständigen Laden manipulieren, aber es kann riskant sein. Sie können natürlich nicht garantieren, dass das Bit des DOM, das Sie zu manipulieren versuchen, tatsächlich existiert, so dass Ihr Code gelegentlich fehlschlagen kann.
Solange Sie nur Knoten ändern, die vor dem Skriptblock stehen (dh das schließende Tag des Knotens geht dem öffnenden Tag des Skripts voran), sollten Sie keine Probleme haben.
Wenn Sie sicherstellen möchten, dass die Operation erfolgreich ist, fügen Sie den Code in einen try...catch -Block ein und rufen Sie ihn erneut über setTimeout() bei einem Fehler auf.
Beim Zugriff auf das DOM werden Ausnahmen in IE 5 und Navigator 4 vorzeitig ausgelöst.
Tags und Links javascript dom domready progressive-enhancement