Connecting Tech Pros Worldwide Forums | Help | Site Map

how to extend document.getElementsBy*() in Firefox

Dormilich's Avatar
Moderator
 
Join Date: Aug 2008
Location: Leipzig, Germany
Posts: 3,660
#1: Jun 16 '09
I want to add (prototype) a method to the node list returned by document.getElementsByName() (and related, i.e. NodeList resp. HTMLCollection).

unfortunately, neither the NodeList nor the HTMLCollection interface seem to be prototypable in Firefox. (NodeList works in Safari & Opera, don't know about IE)

has anyone of you an idea how to solve this?

note: this matter has already been discussed, though I didn't find any solution to this problem. (beside prototyping into Object interface).

acoder's Avatar
Site Moderator
 
Join Date: Nov 2006
Location: UK
Posts: 14,581
#2: Jun 16 '09

re: how to extend document.getElementsBy*() in Firefox


I don't think this is possible. Either create a function which does the job or create your own object with the nodelist and then extend that instead.
Dormilich's Avatar
Moderator
 
Join Date: Aug 2008
Location: Leipzig, Germany
Posts: 3,660
#3: Jun 16 '09

re: how to extend document.getElementsBy*() in Firefox


you mean substituting document.getElementsBy*() with my own function (kind of)?
gits's Avatar
Moderator
 
Join Date: May 2007
Location: Munich, Germany
Posts: 4,136
#4: Jun 16 '09

re: how to extend document.getElementsBy*() in Firefox


may be you could live with something like that:

Expand|Select|Wrap|Line Numbers
  1. document.baseGetElementsByTagName = document.getElementsByTagName;
  2.  
  3. document.getElementsByTagName = function(n) {
  4.     top.console.log(this.baseGetElementsByTagName(n));
  5. }
  6.  
  7. document.getElementsByTagName('div');
kind regards
acoder's Avatar
Site Moderator
 
Join Date: Nov 2006
Location: UK
Posts: 14,581
#5: Jun 16 '09

re: how to extend document.getElementsBy*() in Firefox


Quote:

Originally Posted by Dormilich View Post

you mean substituting document.getElementsBy*() with my own function (kind of)?

Not necessarily. You could have a function which does whatever you want to do with the node-list and pass it the result of document.getElementsBy*(). If that's not to your liking, create your own object and pass it the node-list and extend to your heart's content.
Dormilich's Avatar
Moderator
 
Join Date: Aug 2008
Location: Leipzig, Germany
Posts: 3,660
#6: Jun 17 '09

re: how to extend document.getElementsBy*() in Firefox


@gits: that won't do, since I don't want to do that for every method that's returning a HTMLCollection.

@acoder: passing the NodeList as argument seems indeed the best way.

maybe I'll do both in a try-catch block…
gits's Avatar
Moderator
 
Join Date: May 2007
Location: Munich, Germany
Posts: 4,136
#7: Jun 17 '09

re: how to extend document.getElementsBy*() in Firefox


hmmm ... what about that simple loop for that task? :) (FF + Firebug to test in console)

Expand|Select|Wrap|Line Numbers
  1. function extendMethod(fn) {
  2.     top.console.log(fn);
  3.  
  4.     document['base' + fn] = document[fn];
  5.  
  6.     document[fn] = function(n) {
  7.         nodeList = this['base' + fn](n);
  8.         nodeList = doSomethingWithNodeList(nodeList);
  9.  
  10.         return nodeList;
  11.     };
  12. }
  13.  
  14. for (var i in document) {
  15.     if (/getElements/.test(i)) {
  16.         extendMethod(i);
  17.     }
  18. }
  19.  
  20. function doSomethingWithNodeList(nl) {
  21.     top.console.log(nl);
  22. }
  23.  
  24. document.getElementsByClassName('normal');
  25.  
that would always pass the nodelist for all 'getElements'-methods to a function called 'doSomethingWithNodeList' ... before the 'getElements'-method returns

kind regards
Dormilich's Avatar
Moderator
 
Join Date: Aug 2008
Location: Leipzig, Germany
Posts: 3,660
#8: Jun 17 '09

re: how to extend document.getElementsBy*() in Firefox


I have to bear that in mind, maybe I can use it sometimes…

that's what I want to do:
Expand|Select|Wrap|Line Numbers
  1. document.getElementsByClassName("attachEvent").addEventForEach("click", doSomething, false, some_param);
obviously the initial thought was to extend HTMLCollection or NodeList. but alas, I don't want to call a function (i.e. attach an event) every time I get a HTMLCollection from the document. seems like I have to use a function, where I pass the NodeList…

EDIT: hm, maybe I can do something with prototype's bind() method…
gits's Avatar
Moderator
 
Join Date: May 2007
Location: Munich, Germany
Posts: 4,136
#9: Jun 18 '09

re: how to extend document.getElementsBy*() in Firefox


the construct does that exactly? here is just a litle adaption to have it a bit more generic :)

Expand|Select|Wrap|Line Numbers
  1. function extendMethod(fn) {
  2.     top.console.log(fn);
  3.  
  4.     document['base' + fn] = document[fn];
  5.  
  6.     document[fn] = function(n, eachFn) {
  7.         nodeList = this['base' + fn](n);
  8.         nodeList = eachFn(nodeList);
  9.  
  10.         return nodeList;
  11.     };
  12. }
  13.  
  14. for (var i in document) {
  15.     if (/getElements/.test(i)) {
  16.         extendMethod(i);
  17.     }
  18. }
  19.  
  20. document.getElementsByClassName('normal', function(n) {
  21.     for (var i in n) top.console.log(n[i]);
  22. });
  23.  
this expl. code could just simply integrated into any oo framework etc. and now it' s able to get an eachFn param passed to the getElements-method ... that is a function that should be called with every node of the returned nodelist.

kind regards
Dormilich's Avatar
Moderator
 
Join Date: Aug 2008
Location: Leipzig, Germany
Posts: 3,660
#10: Jun 18 '09

re: how to extend document.getElementsBy*() in Firefox


Quote:

Originally Posted by gits View Post

now it' s able to get an eachFn param passed to the getElements-method

in the end it's like calling eachFn(nodeList) inside the getElementsBy*() method. so I just moved the function call from outside to inside… well, for my current problem this rather seems not worth it.

thanks anyway for the insight into method manipulation.
gits's Avatar
Moderator
 
Join Date: May 2007
Location: Munich, Germany
Posts: 4,136
#11: Jun 18 '09

re: how to extend document.getElementsBy*() in Firefox


:) nothing to thank for ... i currently think about such things too since you asked that question ... and for our current goal those ideas above might help us sometimes ;) ...

kind regards
Dormilich's Avatar
Moderator
 
Join Date: Aug 2008
Location: Leipzig, Germany
Posts: 3,660
#12: Jun 18 '09

re: how to extend document.getElementsBy*() in Firefox


found some talk about DOM iteration 1, 2. this could be a useful starting point.
Reply