CSS verwendet den js-Ausdruck, um den Austausch von effects_Experience zu erreichen

IE5 und spätere Versionen unterstützen die Verwendung von Ausdruck in CSS, um CSS-Eigenschaften mit Javascript-Ausdrücken zu verknüpfen. Die CSS-Eigenschaften können hier inhärente Eigenschaften des Elements oder benutzerdefinierte Eigenschaften sein. Das heißt, auf das CSS-Attribut kann ein Javascript-Ausdruck folgen, und der Wert des CSS-Attributs entspricht dem Ergebnis der Berechnung des Javascript-Ausdrucks. Sie können im Ausdruck direkt auf die Eigenschaften und Methoden des Elements selbst verweisen oder andere Browserobjekte verwenden. Der Ausdruck ist so, als ob er innerhalb einer Mitgliedsfunktion dieses Elements wäre.

Weisen Sie inhärenten Eigenschaften von Elementen Werte zu

Sie können beispielsweise ein Element entsprechend der Größe des Browsers positionieren.

#myDiv {
width: 100px;
height: 100px;
left: expression(document.body.offsetWidth - 110 + "px");
top: expression(document.body.offsetHeight - 110 + "px");
background: red;
}

Weisen Sie dem benutzerdefinierten Attribut des Elements einen Wert zu

Entfernen Sie beispielsweise das gepunktete Linkfeld auf der Seite. Der übliche Ansatz ist:


link1
link2
link3
Es ist möglicherweise nicht sichtbar Dies zeigt auf den ersten Blick die Vorteile der Verwendung von Ausdruck, aber wenn es Dutzende oder sogar Hunderte von Links auf Ihrer Seite gibt, werden Sie dann immer noch Strg+C und Strg+V mechanisch verwenden? Und was bringt mehr Redundanz, wenn man die beiden vergleicht? Wie wäre es mit weiteren Codes?

Der Ausdruck wird wie folgt verwendet:


link1
link2
link3

Erläuterung: Der Stern darin ist ein willkürlich definiertes Attribut Sie können es nach Belieben definieren, und dann ist die in expression() enthaltene Anweisung das JS-Skript. Vergessen Sie nicht, dass zwischen dem benutzerdefinierten Attribut und dem Ausdruck ein Anführungszeichen steht im Style-Tag platziert und nicht im Skript. OK, es ist also einfach, den gepunkteten Link-Kästchen auf der Seite in einem Satz zu entfernen. Aber seien Sie nicht selbstgefällig, wenn der ausgelöste Spezialeffekt eine CSS-Attributänderung ist, wird das Ergebnis von Ihrer ursprünglichen Absicht abweichen. Wenn Sie beispielsweise die Farbe des Textfelds auf der Seite ändern möchten, während Sie die Maus hinein- und herausbewegen, denken Sie vielleicht natürlich, dass es so geschrieben werden sollte:

Eingabe
{star : expression(onmouseover=this.style.backgroundColor="#FF0000"; onmouseout=this.style.backgroundColor="#FFFFFF")}

Aber das Ergebnis ist ein Skriptfehler. Die richtige Art, es zu schreiben, ist Fügen Sie die Definition des CSS-Stils wie folgt in die Funktion ein. Anzeige:


Hinweis Es ist nicht unbedingt erforderlich, Expression zu verwenden, da Expression höhere Browserressourcen erfordert.

Beispiel: Ausdruck in CSS verwenden, um die Stapelsteuerung von Schnittstellenobjekten zu implementieren

Problembeschreibung: Aus der Verwendung von CSS-Stilen wissen wir, dass wir das Klassenattribut eines Stapels von Objekten definieren können, um dasselbe zu spezifizieren Stil. Aber wie kann man die Ereignisse von Objekten desselben Typs vereinheitlichen? jpg?

Lösung: Verwenden Sie die Ausdrucksmethode von CSS
Für eine spezifische Implementierung schauen Sie sich bitte die Schreibmethode von .css an:

/*Ersetzen Sie das Bild-CSS*. /
#imgScript { /*Verwenden Sie hier die Objekt-ID als Platzhalter. Stil, Sie können auch eine CSS-Funktion definieren*/
star:expression(
onmouseover = function()
{
/*Bild ersetzen*/
if(this.hover != null) {
this.name = this.src;
this.src = this.src.replace('.jpg', '_over .jpg');
this.HasChg = 1;
}
},
onmouseout = function()
{
/*Das Originalbild wiederherstellen*/
if (this.HasChg != null){
this.src = this. Ende imgScript*/