Heim > Web-Frontend > CSS-Tutorial > Analyse der Gründe, den CSS Expression_Experience-Austausch nicht zu verwenden

Analyse der Gründe, den CSS Expression_Experience-Austausch nicht zu verwenden

WBOY
Freigeben: 2016-05-16 12:04:44
Original
1150 Leute haben es durchsucht

Verwenden Sie JavaScript-Ausdrücke im CSS-Ausdruck. CSS-Eigenschaften werden basierend auf der Auswertung von JavaScript-Ausdrücken festgelegt.
Der CSS-Ausdruck funktioniert in anderen Browsern nicht, daher ist es sinnvoller, ihn bei der browserübergreifenden Codierung separat für den IE einzurichten.
CSS Expression wird ab IE5 unterstützt. Schauen wir uns den folgenden Code an:

Code kopieren Der Code lautet wie folgt:

Hintergrund- color: expression( (new Date()).getHours()%2 ? "#F00" : "#00F" );

Der obige Code verwendet CSS Expression, um die Hintergrundfarbe stündlich zu ändern .
Das Problem mit CSS Expression besteht darin, dass seine Berechnungshäufigkeit viel höher ist als gedacht. Nicht nur, wenn die Seite angezeigt und gezoomt wird, sondern auch, wenn die Seite gescrollt wird und sogar wenn die Maus bewegt wird, wird sie neu berechnet. Fügen Sie einem CSS-Ausdruck einen Zähler hinzu, um zu verfolgen, wie oft ein Ausdruck ausgewertet wird. Sie können problemlos mehr als 10.000 Berechnungen durchführen, indem Sie einfach die Maus über die Seite bewegen.
Eine Möglichkeit, die Anzahl der CSS-Ausdrucksberechnungen zu reduzieren, besteht darin, einen einmaligen Ausdruck zu verwenden, der das Ergebnis bei der ersten Ausführung dem angegebenen Stilattribut zuweist und dieses Attribut anstelle des CSS-Ausdrucks verwendet.
Wenn sich Stileigenschaften während der Seitenzyklen dynamisch ändern müssen, ist die Verwendung von Ereignishandlern anstelle von CSS-Ausdrücken ein praktikabler Ansatz. Wenn Sie CSS-Ausdrücke verwenden müssen, denken Sie daran, dass diese tausende Male berechnet werden und sich möglicherweise auf die Leistung Ihrer Seite auswirken. Geben Sie Ihren Benutzern nicht das Gefühl, dass der Computer beim Öffnen Ihrer Seite sehr langsam ist.


Verwandte Etiketten:
css
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage