CSS direkt in JavaScript einbinden

[Gelöschtes Mitglied 27690]

Hallo Leute,

Ich arbeite mit einem Firefox-Plugin, mit dem ich eine Website im Browser nachträglich per JavaScript verändern kann. Nun möchte ich aber auch das CSS verändern, und da das ziemlich viel ist und ich nicht jedes mal mit

<script type="text/javascript">
document.getElementById(objId).style... = "...";
</script>

arbeiten will/kann muss ich das CSS direkt in JS einbinden. Kennt da jemand einen Weg?
Danke im Voraus;)

 

[threadi]

Wenn Du vermeiden willst, viele CSS-Eigenschaften per JavaScript zu ändern, verwende doch CSS-Klassen. Diese beinhalten dann die Eigenschaften die Du jeweils setzen willst. Eine CSS-Klasse setzt man per JavaScript mit:

obj.className = "neuerKlassenname";

Wenn Du eine Klasse zu einem Element, welches bereits min. 1 Klasse hat, ergänzen willst, dann:

obj.className = obj.className + " neuerKlassenname";

Wenn Du eine Klasse entfernen willst:

obj.className = obj.className.replace(/alterKlassenname/,"");

 

[Tronjer]

Schau dir mal jQuery an. Da gibt es neben addClass() auch css(). Ist wesentlich komfortabler als mit vanilla JS.

 

[omoxen]

Es gibt auch Mozilla Plugins für CSS-Dateien...

Ansonsten:

with(document.getElementById(objId).style) {
color = "gray";
border = "1px solid black";
}

(mit "with" fügst du das Objekt in deinen Variable-Scope ein)
oder:

Object.prototype.prop = function(obj){
for(var i in obj)
this = obj;
}

document.getElementById(objId).style.prop({
color:"gray",
border:"1px solid black";
}

(die Funktion prop erweitert das object um "obj")
oder du schreibst deinen eigenen CSS-Parser...

oder veränderst "document.styleSheets"

 

[Gelöschtes Mitglied 27690]

Okay, hab das jetzt alles mal probiert, mein Problem dabei ist nur, dass ich das alles in ein Firefox-Addon packen wollte, das dann je nach Einstellungen ein reines CSS-Script (!) von einem Server importiert und direkt beim Klick auf das Addon sozusagen "mitrendert". Das im Addon verwendete JavaScript verwirrt mich aber völlig, da es absolut nicht so funktioniert wie ich es gewohnt bin... :???: