So optimieren Sie die Leistung von CSS-Ausdrücken

Methoden zur Optimierung der Leistung von CSS-Ausdrücken: 1. Führen Sie den CSS-Ausdruck nur einmal im passenden Element aus. 2. Setzen Sie im CSS-Ausdruck-Anweisungskörper die CSS-Eigenschaften zurück, die den Ausdruck auslösen.

Die Betriebsumgebung dieses Artikels: Windows7-System, HTML5 und CSS3, Dell G3-Computer.

Wie optimiert man die Leistung von CSS-Ausdrücken?

Das größte Problem mit der CSS-Ausdrucksfunktion im IE-Browser: Sie wird wiederholt ausgeführt, möglicherweise hunderte oder tausende Male pro Sekunde, was zu ernsthaften Leistungsproblemen führt. Wie optimiert man den CSS-Ausdruck?

Zumindest: Wenn wir CSS Expression nur einmal im passenden Element ausführen, wird die Leistung erheblich verbessert.

old9 bietet im Artikel „CSS Expression Reloaded“ eine Lösung:

Im CSS-Ausdruck-Anweisungskörper werden die CSS-Eigenschaften des Ausdrucks zurückgesetzt.

Empfohlen: „

CSS-Video-Tutorial

“Zum Beispiel:

div {
    zoom: expression(function(el){el.style.zoom = "1"; alert(el.tagName);}(this));
}

Ein paar zusätzliche Punkte:

CSS-Ausdruck wird auf jedem passenden Element ausgeführt.

Im CSS-Ausdruck verweist das Schlüsselwort „this“ auf das aktuell übereinstimmende HTML-Element.

CSS-Eigenschaften verwenden zum Auslösen einige ungewöhnliche Eigenschaften und werden nach dem Auslösen auf die Standardwerte zurückgesetzt.

Es gibt eine ähnliche Lösung:

div {
    -singlex: expression(this.singlex ? 0 : (function(t) { 
    alert(t.tagName); t.singlex = 0; 
    } )(this));
}

Aber dieser Code löst das größte Leistungsproblem von CSS Expression nicht vollständig. Denn das Expression-Skript muss immer noch jedes Mal ausgeführt werden, wenn es ausgelöst wird, beispielsweise wenn Sie mit dem mittleren Rad der Maus scrollen.

Abschließend wird betont, dass CSS Expression nur optimiert ist, dies bedeutet jedoch nicht, dass CSS Expression keine anderen Probleme aufweist.

Das obige ist der detaillierte Inhalt vonSo optimieren Sie die Leistung von CSS-Ausdrücken. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!