CSS-Selektor wird nicht erkannt
heinerle
- javascript
Hallo Forum,
ich bin ein Anfänger im Bereich JavaScript, aber ich bin stolz darauf, dass ich dafür schon recht gutes Verständnis dafür aufbringen kann. Nun bin ich aber auf ein Problem gestossen, bei dem ich nicht weiterkomme:
Ich will CSS-Tags vom Seitenanfang auslesen, manipulieren und anschliessend wieder zurückschreiben. Das klappt eigentlich alles recht gut, auch Pseudoklassen kann ich damit verändern. Das Problem taucht dann auf, wenn ich eine Liste mit Selektoren habe.
z.B.: h1,h2,p {color: #000000;}
bisher lese ich die CSS in einer Schleife mit folgendem Schema aus:
wenn IE, dann rules = docstyle.rules
sonst rules = docstyle.cssRules
for (k=0;k<rules.length;k++){
cssToLower = rules.item(k).selectorText.toLowerCase()
if (cssToLower == neuerTag)
{
rules.item(k).style.color = document.getElementById("bg_modul").value;
}
}
Das ist nur mal ein Schema, ich wollte nicht jede Kleinigkeit posten.
Jedenfalls funktioniert das ganze, egal welchen Browser ich benutze. Das Problem bekomme ich ich nur bei solchen Sachen wie h1,h2,p
Der InternetExplorer erkennt beim durchlaufen der Schleife statt h1,h2,p 3 einzelne Selektoren statt einem zusammengefassten, und Firefox erkennt den Selektor gar nicht.
Kann mir bitte jemand einen Tip geben, wie ich in beiden Browsern die 3 Werte verändern kann? Also: wie kann ich mit beiden Browsern den Selektor h1,h2,p auslesen?
Die Variante, die mir IE anbietet wäre zur Not ja auch brauchbar für mich, aber bleibt das Problem mit Firefox/Mozilla, welche diesen speziellen Selektor gar nicht erkennen.
Bitte bitte helft mir schnell, denn dieses Problem hält mich davon ab, mein Projekt zu beenden.
mfg
heinerle
PS: schlagt mir bitte nicht vor, einfach diesen Selektor zu trennen und 3 neue daraus zu machen, diese Möglichkeit geht aus programmtechnischen Gründen nicht (DB und abhängige Folgescripte)
Nachtrag:
ich hab soeben herausgefunden, dass aus einem mir unbekannten Grund das eigentliche h1,h2,p so ausgelesen wird: h1, h2, p
im Quelltext sind diese Leerzeichen nicht vorhanden. Diese Erkenntnis bringt mich jetzt auch nicht weiter, da ich wie gesagt Anfänger bin, aber hat irgendjemand eine lösung dafür? Hauptsächlich für Firefox, das würde reichen, beim IE könnte ich ja die oben erwähnte Notlösung benutzen.
thx
heinerle
Hi,
ich bin ein Anfänger im Bereich JavaScript, aber ich bin stolz darauf, dass ich dafür schon recht gutes Verständnis dafür aufbringen kann.
Immerhin bewegst Du dich in einem Bereich, den Anfänger oft nicht mal kennen. ;)
Daß die Browser das unterschiedlich handhaben, war mir bislang noch nicht aufgefallen. Ich habe bislang solche Mehrfachselektoren nicht bearbeitet (ich ändere in der Praxis nur Klassen- & ID-Selektoren).
Ich habe deinen Hinweis deswegen mal zum Anlaß genommen, meine CSS-Routine dahingehend anzupassen: Coding: CSS-Regeln auslesen & ändern
Kann mir bitte jemand einen Tip geben, wie ich in beiden Browsern die 3 Werte verändern kann? Also: wie kann ich mit beiden Browsern den Selektor h1,h2,p auslesen?
Auslesen geht (bei meiner Routine) nun, indem man die *Einzel*selektoren angibt: alert(cssRule("h2"));
cssRule() splittet den Mehrfachselektor *intern* auf.
Beim Ändern muß man ebenfalls die Einzelselektoren ändern, also z.B.:
cssRule("h1","color","red"); cssRule("h2","color","red"); cssRule("p","color","red");
Nur dann greift die Änderung auch beim IE bei allen 3 Tags (die anderen Browser ändern schon beim ersten Aufruf auch den Rest).
Gruß, Cybaer