peterS.: DOM-getter und array-iteratoren - scripte schneller entwickeln

Beitrag lesen

gruss Interessierte,

ich habe mal die ueber die letzten 5 Jahre bei mir aufgelaufenen
loesungen zu den im forum am haeufigsten nachgefragten aber eben
(noch) nicht von den w3c-spezifikationen beruecksichtigten *wunsch-
DOM-getter*n auf vordermann gebracht und zu grossen teilen auf die
von mir hochgeschaetzten array iteratoren/accessoren draufgesetzt.

herausgekommen ist moeglicherweise sogar eine minimale bibliothek
zur geradlinigen und schnellen DOM-programmierung, die sich unter
den gesichtspunkten "syntax" und "namensraum" nahtlos sowohl in die
JavaScript-api als auch die DOM-api einfuegt.

es handelt sich nicht um ein DHTML-framework, welches versucht, alle
moeglichen browserinkompatibilitaeten zur kapseln und vor dem anwender
zu verstecken. die einzelloesungen setzen viel tiefer an, und zumindest
fuer mich verbessert die gesamtheit aller module die abstraktion und
erleichtert und beschleunigt, auch wiederum nur fuer mich gesprochen,
die entwicklung von DOM-scripten auf einer immer noch basalen ebene,
auf der ich alles unter kontrolle zu haben meine ;-)

natuerlich habe ich beim entwickeln auch getestet, und meine testcases
laufen ohne fehler durch - was ich schon aus zeitgruenden alleine aber
nicht leisten kann, ist das fahren des ultimativen haertetests.

und darum geb ich das ding mal frei - zur benutzung und fehlerrueckmeldung.

was kann das teil? - nun:

  • [document.getElementsByClassNames]:

- der klassiker schlechthin, erfunden von Thomas Meinike.

- verdaut regulaere ausdruecke bzw. strings in form *white space*-
    und/oder komma-separierter css-klassen-namen, was im falle der
    *white space*-separation die suche nach kombinierten klassennamen,
    im falle der komma-separation die suche nach mehr als nur einem
    (kombinierten) klassennamen und beim mix natuerlich die kombination
    beider suchen ermoeglicht.

- darueber hinaus gibt es noch die ebenfalls statischen methoden:

- [Node.getElementsByClassNames] wo der filter ueber alle
      unterelemente eines [HTMLElement]- bzw. eines [Node]-
      objekts laeuft.
    - [NodeList.getElementsByClassNames] wo der filter ueber alle
      eintraege einer wie auch immer gearteten listenstruktur -
      [HTMLCollection]s, [NodeList]s, [Array]s - laeuft.

  • [document.getElementsByAttributeAndValue]:

- vielfach gewuenscht:

- akzeptiert fuer den zu suchenden attribut-namen nur strings,
    erwartet fuer den attribut-wert regulaere ausdruecken und
    strings; die werte [undefined] und [null], sowie die string-werte
    "*" und "" fuer den letztgenannten parameter setzen die suche in
    einen *wildcard*-modus, so dass nach allen attribut-namen gesucht
    wird, deren wert weder [undefined] noch ein leerstring ist.

- darueber hinaus gibt es noch die ebenfalls statischen methoden:

- [Node.getElementsByAttributeAndValue] wo der filter ueber alle
      unterelemente eines [HTMLElement]- bzw. eines [Node]-
      objekts laeuft.
    - [NodeList.getElementsByAttributeAndValue] wo der filter ueber
      alle eintraege einer wie auch immer gearteten listenstruktur -
      [HTMLCollection]s, [NodeList]s, [Array]s - laeuft.

  • [document.getElementsByAttributeSelector]:

- von Cheatah in die runde geworfen:

- versucht sich in der interpretation eines css 3 element- und/oder
    attribut-selectors, der folgendem schema genuegen muss:
    http://www.w3.org/TR/2001/CR-css3-selectors-20011113/#selectors

- darueber hinaus gibt es noch die ebenfalls statischen methoden:

- [Node.getElementsByAttributeSelector] wo der filter ueber alle
      unterelemente eines [HTMLElement]- bzw. eines [Node]-
      objekts laeuft.
    - [NodeList.getElementsByAttributeSelector] wo der filter ueber
      alle eintraege einer wie auch immer gearteten listenstruktur -
      [HTMLCollection]s, [NodeList]s, [Array]s - laeuft.

desweiteren:

  • [document.getCurrentStyle] - wird im forum in grossen abstaenden aber
                                   doch regelmaessig nachgefragt.
  • [document.getCompatMode]
  • [document.isInQuirksMode]
  • [document.getCharset]

grundlage fuer das funktionieren der ausfuehlich beschriebenen DOM-
  getter sind browseruebergreifend implementierte array-iteratoren bzw.
  -accessoren, wie sie von mozilla.org mit JavaScript 1.6 eingefuehrt
  wurden und somit nur browsern zur verfuegung stehen, deren gecko-
  engine nicht *juenger* als version 1.8 sein darf.

fuer alle browser stehen folgende methoden sowohl prototypisch als
  auch statisch zur verfuegung:

  • [Array.indexOf]
  • [Array.lastIndexOf]
  • [Array.contains]
  • [Array.forEach]
  • [Array.every]
  • [Array.some]
  • [Array.map]
  • [Array.filter]

der release steht unter folgender adresse bereit:

die quelldaten des gerade geschnuerten und verlinkten pakets sind zwar
in dessen quellcode aufgefuehrt, sollen aber, falls doch ein breiteres
interesse an verwendung und nutzung besteht, hier noch einmal explizit
genannt werden:

fuer unerschrockene verlinke ich auch gleich nochmal meine drei testcases -
ABER VORSICHT - ich debugge mit ein und auskommentierten ALERTs und im moment
sind alle testfaelle pro seite (so zwischen 30 und 120 alerts pro seite) aktiviert:

auf kommentare und rueckmeldungen wartend - so long - peterS. - pseliger@gmx.net

--
»Because objects in JavaScript are so flexible, you will want to think differently about class hierarchies.
Deep hierarchies are inappropriate. Shallow hierarchies are efficient and expressive.« - Douglas Crockford
ie:( fl:) br:> va:( ls:& fo:) rl:| n3;} n4:} ss:} de:µ js:} mo:? zu:]