¿Cuantas veces hemos teniedo la necesidad de extender las propiedades de nuestro elemenos HTML? ¿La vida no sería más cómoda si el elemento <input />
tuviera un método, validaPass()
? o ¿el elemento <div />
un contains()
?
Podemos recurrir a frameworks (MooTools, Prototype, jQuery,…) para conseguir estas funcionalidades. Para navegadores modernos y estandares, el uso de prototype podría ahorrarnos muchos problemas, pero IE6 … está ahi y no podemos olvidarlos, una solución para este tipo de incompatibilidades sería algo asi.
var DOMElement =
{
extend: function(name,fn)
{
if(!document.all)
eval("HTMLElement.prototype." + name + " = fn");
else
{
//
// IE doesn't allow access to HTMLElement
// so we need to override
// *document.createElement
// *document.getElementById
// *document.getElementsByTagName
//
//take a copy of
//document.createElement
var _createElement = document.createElement;
//override document.createElement
document.createElement = function(tag)
{
var _elem = _createElement(tag);
eval("_elem." + name + " = fn");
return _elem;
}
//take copy of
//document.getElementById
var _getElementById = document.getElementById;
//override document.getElementById
document.getElementById = function(id)
{
var _elem = _getElementById(id);
eval("_elem." + name + " = fn");
return _elem;
}
//take copy of
//document.getElementsByTagName
var _getElementsByTagName = document.getElementsByTagName;
//override document.getElementsByTagName
document.getElementsByTagName = function(tag)
{
var _arr = _getElementsByTagName(tag);
for(var _elem=0;_elem<_arr.length;_elem++)
eval("_arr[_elem]." + name + " = fn");
return _arr;
}
}
}
};
Este código nos permite extender todos los elementos que existan dentro del arbol DOM. Lo que nos permite añadir funcionalidades extras a cada uno de ellos.
// Nos añade a todos los elementos del DOM el método myID() que nos mostrará el ID del elemento.
DOMElement.extend("myID",function(){if(this.id) alert(this.id)});
0 comentarios, 1 referencias
+
#