peterS.: kind-elemente eines [HTMLElement]s nach knotennamen filtern

Beitrag lesen

gruss Christian,

... in diesen DIVs sind wieder weitere DIVs ich brauche aber nur die
aus der ersten Ebene ... alle anderen brauche ich nicht. wie kann ich
diese Filtern ...
...
mit var x = document.getElementById('master').getElementsByTagName('div')
erhalte ich alle DIVs

eben.

... oder gleich nur die Suche auf die 1.Ebene beschränken

richtig geschlussfolgert. die liste aller elemente bekommst Du so ...

var list = document.getElementById('master').childNodes;

... und das stichwort "filtern" hattest Du ja schon selber in die runde
geworfen.

old school:

var arr = [];  
for (var elm, i=0, len=list.length; i<len; ++i) {  
  
  elm = list[i];  
  if (elm && elm.nodeType && (elm.nodeType == 1) && (elm.nodeName.toLowerCase() == "div")) {  
  
    arr.push(elm);  
  }  
}

schoener iterierend:

var arr = Array.filter(document.getElementById('master').childNodes, (function (elm/*, idx, arr*/) {  
  
  return (elm && elm.nodeType && (elm.nodeType == 1) && (elm.nodeName.toLowerCase() == "div"));  
}));

und als generische loesung, die mindestens einen knotennamen sowohl
in einem einzelnen kommaseparierten string bzw. diesen/diese als
array-member erwartet - der optionale zweite parameter steht fuer
den referenzierten knoten, dessen erste ebene nach diesem einen
(oder eben nach mehreren angegebenen) knotennamen gefiltert werden
soll - der parameter kann aber auch ein string sein, der dann als
identifier fuer diesen einstieg des filters dient - bleibt der
zweite parameter unbesetzt, greift [HTMLDocument] als fallback:

var getFirstLevelElementsByNodeNames = (function (nodeNames/*:[string|String|Array:String]*/, obj/*:[Node|HTMLElement|string|String]*/) {/*:Array*/  
  
  
  var isUndefined = (function (obj) {return (typeof obj == "undefined");});  
  var isNull = (function (obj) {return ((typeof obj == "object") && (!obj));});  
  var isNative = (function (obj) {return (!isUndefined(obj) && !isNull(obj) && (typeof obj.constructor == "function"));});  
  var isStringValue = (function (obj) {return (typeof obj == "string");});  
  var isString = (function (obj) { return (isStringValue(obj) || (isNative(obj) && (obj instanceof String)));});  
  var isArray = (function (obj) {return (isNative(obj) && (obj instanceof Array));});  
  
  
  var list = [], regXNodeNames, regXWSGlobal = (/\s+/g), regXPipesGlobal = (/\|+/g);  
  
  
  if (isString(nodeNames)) {  
  
    nodeNames = nodeNames.split(",");  
  }  
  if (isArray(nodeNames)) {  
  
  
    obj = (isString(obj) ? (document.getElementById(obj) || document) : ((isUndefined(obj) || isNull(obj) || !obj.childNodes) ? (document) : (obj)));  
  
  
    nodeNames = nodeNames.filter(function (elm/*, idx, arr*/) {  
  
      return (isString(elm) && (elm !== ""));  
    });  
  
  
    regXNodeNames = new RegExp("^(?:" + nodeNames.join("|").replace(regXWSGlobal, "").replace(regXPipesGlobal, "|") + ")$", "");  
  
  
    list = Array.filter(obj.childNodes, (function (elm/*, idx, arr*/) {  
  
      return (elm && elm.nodeType && (elm.nodeType == 1) && regXNodeNames.test(elm.nodeName.toLowerCase()));  
    }));  
  }  
  
  
  return list;  
});

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:]