Since the Firefox [Bug 633133] of the in operator on DOM Collections has ben finally fixed - We can now write a short fast and clean function of the method "Contains" for FirefoX to check if x.contains(y). And vice- versa.
What we will need is:
a prototype
and we'll chose to use the:
var pro = window.HTMLElement.prototype
that :') will overwrite the native method existing in other gen-V browsers also.
But first (as a bonus) we will write a descendants method so we can chain them and use les code for more productivity:
oElement.descendants( [filter] )
pro.descendants = function(x){
x = this.getElementsByTagName(x?x:"*")
return x.length?x:null;
}
and now we will write the (dependent to descendants) contains method:
oElement.contains( targetElement,[optFilter] )
pro.contains=function(x,y){
return this.descendants(y)[x.id]
}
And this is it! Now you have both oElement.descendants([tagsFilter]) and the practical oElement.contains(targetElement, [tagsFilter]).
The [tagsFilter ] is completely optional but is available for further optimization of your code, even though this code is as fast as native - further optimization does no harm . On contrary using it in this manner:
oElement.contains(targetElement, "SPAN")
makes it even faster .
--------------------------------------------------
PS.:
The only drawback of this short dimple and fast code method is that it can't be used against anonymous elements, or to be exact elements with no ID. Although 99.9% of all times - nobody uses it in blind tests ever (targeting anonymous elements under click or some other mouse event and extracting the argument through event.target/srcelement or similar). But we can afford to add few more letters of code and make it possible.
pro.
contains=function(x,y){
x.id?'':x.id='_id'
return this.descendants(y)[x.id]
}
Attention: this method assigns an id: '_id' to the tested 'this' ( no-id element).
But if that poses a problem for us, we can remove it as soon as we are done with it.
pro.
contains=function(x,y){
x.id?'':x.id='_id';
x = this.descendants(y)[x.id];
x.id=='_id'?x.id='':0;
return x
}
if(x.contains(y)) //evaluates true/false;
But also returns the element object, therefore you are able to write something like this: x.contains(y).style...some property
[...]