Roadster: Fragen zur Notation

Beitrag lesen

Hallo miteinander!

Habe noch was gefunden, zu dem mich mal eure Einschätzungen interessieren würden, wobei ich die Diskussion über die Zweckmäßigkeit der Grundprämisse selbst mal außen vor lassen möchte, - also stellt euch das am besten einfach als hypothetische Situation vor. ;)

Wie schon in einigen Posts von mir beschrieben, generiere ich die Elemente meiner Seite komplett mit JavaScript, was an und für sich auch völlig unproblematisch ist. Die Frage, die ich mir aber stelle ist, wie ich das am besten notiere. Bislang hatte ich für jedes Element eine eigene Funktion, das heißt, im Script sieht das im Moment noch etwa so aus...

function createElement() {  
  
  var parent = document.getElementById( "parent" ),  
      element = document.createElement( "TAG" );  
  
  parent.appendChild( element );  
  
  element.id = "element";  
  
  element.style.display = "block";  
  
  element.style.position = "relative";  
  element.style.margin = "10px auto 0px";  
  element.style.width = "200px";  
  element.style.height = "50px";  
  
  element.style.cursor = "pointer";  
  
  element.style.border = "2px solid black";  
  element.style.borderRadius = "5px";  
  
  /* etc. etc. etc. */  
  
}

Der Vorteil darin es so zu machen, ist natürlich der, dass der Code für die Elementerstellung extrem gut lesbar ist, sprich, man sieht auf den ersten Blick wie in einer CSS-Datei sofort alle wichtigen Eigenschaften des Elementes vor sich (was ich noch dadurch unterstützt habe, dass ich für die Notation der style-Attribute eine festgelegte Reihenfolge und eigenschaftsbezogene Gruppierung verwende).

Der Nachteil an dieser Methode ist demgegenüber aber natürlich, dass der Code auch bei einer an und für sich recht überschaubaren Menge an generierten Elementen ziemlich lang wird, wobei die verwendeten Attribute jedoch sehr oft gleich bleiben ( element.style.position = "relative"; ), gegebenenfalls halt nur mit veränderten Werten.

Zu überlegen wäre demnach, ob man das nicht verkürzen kann (und vor allem sollte), indem man sowohl die Elemente als auch die Werte für bestimmte Attribute, in Arreys zwischenspeichert, um sie dann in generalisierten Funktionen zusammenzubringen. Also, sprich, statt linear vorzugehen und ein Element nach dem anderen zu erstellen, könnte man ja auch quasi in einer hierarchischen Funktion von 'oben herab' über for-Schleifen die Elemente erstellen und stylen...

Ich schätze, damit würde ich wohl locker 80% Code für die "createElement"-Funktionen einsparen. Aber womöglich auch 80% der Lesbarkeit?  ;)  Welche Variante haltet ihr für vorzugswürdig?

Gruß,

Roadster.