2009-04-09 7 views
0

Ich benutze jQuery monatlichen Kalender, in dem jeder Tag ist eine Zelle, onClick in der Zelle, ich bin in der Lage, die Warnung zu drucken, aber ich möchte auch die Hintergrundfarbe des ändern Zelle, auf die ich geklickt habe. Aber ich bekomme nicht den Weg, CSS mit Javascript aufzurufen. Bitte hilf mir.Wie benutze ich css innerhalb einer JavaScript-Funktion

Antwort

4

In jQuery, können Sie die css method verwenden, um die Hintergrundfarbe der Zelle zu ändern:

// let's say this is in a loop 
$(this).css('background-color', '#f00'); 
4

Und im Klar JavaScript:

var element = document.getElementById("myElement"); 
element.style.backgroundColor = "#fff"; 

Steve

0

So stellen Sie ein CSS Eigentum:

$("#myCalender").css("background-color","SomeColor"); 

Um eine ganze Klasse gesetzt:

$("#myCalender").addClass("DifferentBGColorClass"); 
0

die Hintergrundfarbe zu ändern, die Sie verwenden können:

 
document.getElementById("").style.backgroundColor = "#ffffff"; 
3

JS Mit ändern Sie den Stil Eigenschaft jedes Element eine sehr hohe Spezifität der Regel erzeugt, die hart ist zu erkennen und zu entfernen, und weniger flexibel, wenn Sie mit mehreren Stileffekten arbeiten (sagen Sie, dass Sie sowohl einen Rahmen als auch einen Hintergrund wollten, jetzt haben Sie doppelt so viel zu tun).

Fast immer ist es viel besser, von einer Wartung, Flexibilität und Trennung-of-Bedenken Sicht nicht den Stil eines Elements direkt zu ändern, aber es ist Klasse zu ändern und lassen Sie CSS die Arbeit für Sie tun .

zB mag ich diese Grenze + Hintergrund Stil ändern, so dass ich eine Klasse in meinem CSS

.highlight 
{ 
    border: 1px solid black; 
    background: white; 
} 

definieren und dann werde ich das Element ändern, wo ich so gern brauchen:

In der Praxis würde ich diesen klassenmodifizierenden Code jetzt in einen allgemeineren Wrapper einpacken, um mich davor zu schützen, die gleiche Klasse zweimal zuzuweisen und das Entfernen wieder zu vereinfachen, aber im Prinzip sieht man, dass es jetzt wäre trivial, um den Effekt von "highlight" an nur einem einzigen Punkt zu ändern, ermöglicht es normale Kaskadierung, und es ist viel einfacher zu erkennen, dass das Element eine Hervorhebungsklasse hat, als zu prüfen, ob es eine Hintergrundfarbe von FOO und einen Rand von BAR hat.

Es, auch wichtig, fügt semantischen Wert hinzu. Selbst dokumentierender Code ist ein sehr gutes Ding.