Element.getAttribute('style') auslesen und zurückschreiben

[HaThoV]

Moin Gemeinde,

ich lese via AJaX eine XML-Datei ein, die HTML-Fragmente enthält. Für den IE muß ich 'class' und 'style'-Angaben darin auslesen und via '.className' bzw. '.style ' zurückschreiben.

Klassenzuweisung ist simpel, aber wie weise ich dem Klon die ausgelesenen Styleangaben zu?

Falls jemand die Problemlösung kennt: Danke schon mal im voraus.

mfg
T.

[Struppi]

ich lese via AJaX eine XML-Datei ein, die HTML-Fragmente enthält. Für den IE muß ich 'class' und 'style'-Angaben darin auslesen und via '.className' bzw. '.style ' zurückschreiben.
Klassenzuweisung ist simpel, aber wie weise ich dem Klon die ausgelesenen Styleangaben zu?

Die Frage ist, in welcher Form liegen diese vor?

Struppi.

[HaThoV]

Moin Gemeinde,

Die Frage ist, in welcher Form liegen diese vor?

als XML.

mfg
T.

[Struppi]

als XML.

XML ist ja nur eine Beschreibungssprache, ich nehme an du meionst als String. Dann musst du dir den irgendwie auseinander und in das element entsprechend einbauen.

Struppi.

[HaThoV]

Moin Struppi,

XML ist ja nur eine Beschreibungssprache, ich nehme an du meionst als String.

Den lese ich aus dem XML-Element aus. Ja.

Dann musst du dir den irgendwie auseinander und in das element entsprechend einbauen.

Gute Idee. Das Auseinandernehmen ist ja auch kein Problem. Letzteres ist vielmehr die Frage: wie weise ich die ausgelesene Information aus dem Quellelement als veritable style.eigenSchaft dem Klon zu?

mfg
T.

[Struppi]

Gute Idee. Das Auseinandernehmen ist ja auch kein Problem. Letzteres ist vielmehr die Frage: wie weise ich die ausgelesene Information aus dem Quellelement als veritable style.eigenSchaft dem Klon zu?

Es ist kein Klon, es ist ein normaler String, den du in Eigenschaften und Werte umwandeln musst.
style[Eigenschaft] = wert;

Wobei du dann noch eine Funktion einbauen musst, die aus CSS Eigenschaften JS CSS Eigenschaften macht.

Ich hab dazu mal sowas gefunden:

String.prototype.camelize = function()  
{  
 // CSS Format umwandeln in das JS Format  
 var i = this.indexOf('-');  
  
 if(i == -1) return this;  
 var tmp = this.substring(0, i)  
 + this.substr(i + 1, 1).toUpperCase()  
 + this.substring(i + 2)  
 ;  
 return tmp;  
}  

Struppi.

[HaThoV]

Moin Gemeinde,

Wobei du dann noch eine Funktion einbauen musst, die aus CSS Eigenschaften JS CSS Eigenschaften macht.

Ich hab dazu mal sowas gefunden:

Offenbar nicht. Wie ich den String konvertiere, ist mir klar. Nur: wie mache ich aus dem String eine Funktionszuweisung?

mfg
T.

[Struppi]

Wobei du dann noch eine Funktion einbauen musst, die aus CSS Eigenschaften JS CSS Eigenschaften macht.

Ich hab dazu mal sowas gefunden:

Offenbar nicht. Wie ich den String konvertiere, ist mir klar. Nur: wie mache ich aus dem String eine Funktionszuweisung?

Wie meinst du das?
Du musst schon genauer werden, sonst bringt das hier nichts.

Struppi.

[HaThoV]

Moin Gemeinde,

Du musst schon genauer werden, sonst bringt das hier nichts.

Ich denke, das Problem ist ausreichend geschildert. Wie mache ich aus dem String "text-align:left" folgende Funktionszuweisung (nachdem ich den Substring "text-align" natürlich zu "textAlign" konvertiert habe:

document.getElementById('irgendwas').style.textAlign = 'left'

???

Oder ist das Problem, dass Du meine Frage einfach nicht verstehst?

mfg
T.

[Struppi]

Du musst schon genauer werden, sonst bringt das hier nichts.

Ich denke, das Problem ist ausreichend geschildert.

Nein war es bisher nicht! Wie kommst du darauf, dass wir automatisch Wissen was bei dir passiert?

Wie mache ich aus dem String "text-align:left" folgende Funktionszuweisung (nachdem ich den Substring "text-align" natürlich zu "textAlign" konvertiert habe:

document.getElementById('irgendwas').style.textAlign = 'left'

Genau diese Beschreibung hat bisher gefehlt.

Oder ist das Problem, dass Du meine Frage einfach nicht verstehst?

Ich habe deine Frage sehr gut verstanden, ich habe sie sogar schon beantwortet, obwohl du mir nicht sagen wolltest was du genau machst und es jetzt nochmal zu beantwortet hab ich keinen Bock mehr.

Struppi.

[HaThoV]

Moin Gemeinde,

Du musst schon genauer werden, sonst bringt das hier nichts.

Ich denke, das Problem ist ausreichend geschildert.

Nein war es bisher nicht! Wie kommst du darauf, dass wir automatisch Wissen was bei dir passiert?

Wieso automatisch. Im Ursprungsbeitrag hab' ich's beschrieben.

Wie mache ich aus dem String "text-align:left" folgende Funktionszuweisung (nachdem ich den Substring "text-align" natürlich zu "textAlign" konvertiert habe:

document.getElementById('irgendwas').style.textAlign = 'left'

Genau diese Beschreibung hat bisher gefehlt.

Oder ist das Problem, dass Du meine Frage einfach nicht verstehst?

Ich habe deine Frage sehr gut verstanden, ich habe sie sogar schon beantwortet, obwohl du mir nicht sagen wolltest was du genau machst und es jetzt nochmal zu beantwortet hab ich keinen Bock mehr.

Das ist schade. Denn ich wüßte nicht, wo Du sie beantwortet hast. Du hast hier einen hübschen "camelizer" zur Konvertierung eines Strings in einen anderen reingestellt, aber nichts, wie man aus diesem ermittelten String eine Funktions- bzw. Eigenschaftszuweisung macht. Und genau die ist das Problem, nichts anderes.

Nix für ungut!
T.

[Struppi]

Wieso automatisch. Im Ursprungsbeitrag hab' ich's beschrieben.

Da hast du von XML gesprochen, ich kann kein XML, aber ich verstehe da eher sowas

<style><attribut><wert></wert></attribut></style>

Zumindest nicht das was du tatsächlich hast.

Das ist schade. Denn ich wüßte nicht, wo Du sie beantwortet hast. Du hast hier einen hübschen "camelizer" zur Konvertierung eines Strings in einen anderen reingestellt, aber nichts, wie man aus diesem ermittelten String eine Funktions- bzw. Eigenschaftszuweisung macht. Und genau die ist das Problem, nichts anderes.

Dann scheinst du meine Antowrten nicht gelesen oder verstanden zu haben.

Struppi.

[HaThoV]

Moin Struppi,

Ich habe deine Frage sehr gut verstanden, ich habe sie sogar schon beantwortet, obwohl du mir nicht sagen wolltest was du genau machst und es jetzt nochmal zu beantwortet hab ich keinen Bock mehr.

Das ist schade. Denn ich wüßte nicht, wo Du sie beantwortet hast.

Jetzt weiß ich's, sorry. Hab's vor lauter 'camelizer' übersehen, daß style[Eigenschaft] geht. War zu unauffällig für mich :) Danke also und:

Nix für ungut!
T.

mfg
T.

[Siechfred]

Das ist schade. Denn ich wüßte nicht, wo Du sie beantwortet hast. Du hast hier einen hübschen "camelizer" zur Konvertierung eines Strings in einen anderen reingestellt, aber nichts, wie man aus diesem ermittelten String eine Funktions- bzw. Eigenschaftszuweisung macht. Und genau die ist das Problem, nichts anderes.

Mal ins Unreine getippt, damit wir hier nicht aneinander vorbeireden bzw. ich Dein Anliegen richtig verstehe:

function DOMStyle(styleString) {  
  var pairs = styleString.split(';');  
  for (var i=0; i < pairs.length; i++) {  
    var name = pairs[i].substring(0, pairs[i].indexOf(":"));  
    var wert = pairs[i].substring(pairs[i].indexOf(":")+1, pairs[i].length);  
    this[name] = wert;  
  }  
}  
  
var myStyles = new DOMStyle(Element.getAttribute('style'));  
  
for( property in myStyles ) {  
  Element.style[property] = myStyles[property];  
}

Du müsstest noch dafür sorgen, dass die Namen der CSS-Eigenschaften erforderlichenfalls an ihre DOM-Entsprechung angepasst werden sowie Werte bereinigen, wo es erforderlich ist (z.B. Leerzeichen entfernen.

Siechfred

[HaThoV]

Moin Siechfried,

danke auch für Deine späte Hilfe, aber es hat sich alles geklärt. Ich wußte einfach nicht, daß die Notation

style[Eigenschaft] = Wert

mit 'Eigenschaft' als String alternativ möglich ist zu

style.Eigenschaft = Wert

wo das mit dem String nicht geht.

Aber wer nicht gelegentlich dumm fragt, wird auch nicht schlauer... :)

mfg
T.

[Cybaer]

Hi,

Ich hab dazu mal sowas gefunden:

Zu oberflächlich, da das bei float nicht klappt (float ist in JS reserviert - der IE verwendet cssFloat, der Rest styleFloat).

Gruß, Cybaer

[Struppi]

Ich hab dazu mal sowas gefunden:

Zu oberflächlich, da das bei float nicht klappt (float ist in JS reserviert - der IE verwendet cssFloat, der Rest styleFloat).

guter Hinweis.

Struppi.

[Andreas]

Hi HaThoV,

wie weise ich die ausgelesene Information aus dem Quellelement als veritable style.eigenSchaft dem Klon zu?

Ich weiß nicht, ob ich's mir da jetzt zu einfach mache, aber schau doch mal da:
http://de.selfhtml.org/javascript/objekte/style.htm
Nervig ist, dass die einzelnen Eigenschaften des style-Objekts teilweise anders heißen, als ihre CSS-Pendants. Aber vielleicht brauchst du jja auchh nicht alle Eigenschaften.

Gruß,
Andreas