Ankündigung

Einklappen
Keine Ankündigung bisher.

[Erledigt] Dynamische Elemente (createElement) per CSS ansprechen

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [Erledigt] Dynamische Elemente (createElement) per CSS ansprechen

    Hi,

    Ich generiere HTML-Elemente (z.B. DIV) nach folgendem Schema:
    Code:
    var obj = document.createElement('div');
    obj.setAttribute('id', 'meindiv');
    body.appendChild(obj);
    Nun möchte ich per CSS drauf zugreifen, als Beispiel:
    Code:
    #meindiv { background:#f00; }
    Leider bleibt das ohne Erfolg.
    Mache ich hingegen folgendes per JavaScript:
    Code:
    document.getElementById('meindiv').style.background = '#f00';
    funktionierts.

    Aber ich muß doch auch mit der CSS Variante die Elemente ansprechen können, oder?
    Zur Info: die Elemente werden an das Dokument gehängt, bevor das CSS geladen wird...

  • Arne Drews
    antwortet
    Jep... Hab nicht dran gedacht, daß das eine Script auch per document.getElementById() drauf zugreift und den Style ändert.
    Entfernt -> Fehler behoben!

    Dank an Euch beide für die Mühe.

    Einen Kommentar schreiben:


  • nikosch
    antwortet
    divbcon.style.background = "#000"; erzeugt eine Inline-Angabe, die zumeist höhere Priorität hat. Benutze im CSS mal !important. Wenn das klappt, gehts ans Debuggen, wo eine priorisierte Angabe steht.

    Einen Kommentar schreiben:


  • Arne Drews
    antwortet
    Kann das grad nicht hochladen, aber ich reich'n Link nach, vielleicht kannst' dann mehr sehen.
    Danke erstmal...

    Einen Kommentar schreiben:


  • ChrisB
    antwortet
    Zitat von Arne Drews Beitrag anzeigen
    Das sollte doch eigentlich funktionieren.
    Ja - deshalb aber auch ohne vollständiges Beispiel nicht zu sagen, wo der Fehler liegt.

    Einen Kommentar schreiben:


  • Arne Drews
    antwortet
    Hi Chris,

    Also Online-Beispiel kann ich Dir momentan nicht bieten, aber hier Original-Zeilen des Quelltextes:
    Code:
    var bcon = document.createElement('div');
    bcon.id = 'bcon'; // schonmal umgesetzt. Klappt, Danke!
    
    var divbcon = document.getElementById('bcon');
    divbcon.style.background = "#000";
    Ich möchte nun - weil es sich um einen Menge weitere Elemente handelt - die Formatierung in einer CSS vornehmen.

    Alternativ zu dem obigen Verfahren, funktioniert das hier nicht:
    Code:
    /* CSS Datei */
    #bcon { background:#000; }
    Das sollte doch eigentlich funktionieren.
    Das CSS wird korrekt geladen, weil andere statische HTML-Elemente entsprechend formatiert werden.

    Kurios, nicht wahr?!

    Einen Kommentar schreiben:


  • ChrisB
    antwortet
    setAttribute sollte man wo immer möglich vermeiden - insb. im IE ist das problematisch.
    Verwende stattdessen obj.id = "meindiv";

    Edit: Wenn der Zugriff über getElementById funktioniert, ist das aber vermutlich nicht die Ursache.
    Ggf. ein Problem mit der Spezifität der Selektoren? (Bei Verwendeung des ID-Selektors zwar auch eher unwahrscheinlich.)
    Zeig' mal etwas mehr relevanten Code, bzw. möglichst gleich ein Online-Beispiel.

    Zur Info: die Elemente werden an das Dokument gehängt, bevor das CSS geladen wird...
    Das sollte vollkommen egal sein, CSS wird immer „live“ ausgewertet.

    Einen Kommentar schreiben:

Lädt...
X