Compare Revisions

NodeList

Change Revisions

Revision 412761:

Revision 412761 by BrianDiPalma on

Revision 412797:

Revision 412797 by BrianDiPalma on

Title:
NodeList
NodeList
Slug:
Web/API/NodeList
Web/API/NodeList
Tags:
"Gecko DOM Reference", "DOM", "DOM 3"
"Gecko DOM Reference", "DOM", "DOM 3"
Content:

Revision 412761
Revision 412797
n48// divs.length === 2 for instance.n
nn50// firstDiv.childNodes.length === 2 for instance.
n53// the 'divs' NodeList is automatically updatedn53// the firstDiv.childNodes NodeList is automatically updated
54// divs.length === 3 now.54// firstDiv.childNodes.length === 3 now.
n90//The code can not executed properly for some reasonn90var arrayMethods = Object.getOwnPropertyNames( Array.prototype );
91//1. The Array.prototype's property are not enumerable,so using f
>or...in loop cannot get the property 
92//2. NodeList[prop] = Array.prototype[prop] this way,the property
> is added to the NodeList function, but not the instance 
93//   so we need to add properties to NodeList.prototype
n95var _arrayProto = Array.prototype;n92arrayMethods.forEach( attachArrayMethodsToNodeList );
96var _funcList = Object.getOwnPropertyNames.call(null,Array.protot
>ype); 
97var _element;
98var _theFunc;
n100for(var prop in _funcList){n94function attachArrayMethodsToNodeList(methodName)
101  _element = _funcList[prop];95{
102  _theFunc = _arrayProto[_element];96    NodeList.prototype[methodName] = Array.prototype[methodName];
103  if(_arrayProto.hasOwnProperty(_element) && typeof(_theF97};
>unc) === 'function'){ 
104    NodeList.prototype[_element] = _theFunc;98 
105    console.log(_theFunc.name + ' has been added!');99var divs = document.getElementsByTagName( 'div' );
106  }100var firstDiv = divs[ 0 ];
107}
n109var links = document.getElementsByTagName('a');n102firstDiv.childNodes.forEach(function( divChild ){
110links.forEach(function(link){103  divChild.parentNode.style.color = '#0F0';
111  link.style.color = '#0F0';
n114    <p>n
115      &nbsp;
116    </p>
t123var links = document.getElementsByTagName('a');t112var divs = document.getElementsByTagName( 'div' );
124forEach.call(links, function(link){ // works in most browsers (pl113var firstDiv = divs[ 0 ];
>ease document here if you find browsers where it doesn't) 
125  link.style.color = '#0F0';114 
115forEach.call(firstDiv.childNodes, function( divChild ){
116  divChild.parentNode.style.color = '#0F0';

Back to History