Entonces, tengo mi función personalizada que quiero hacer algo con el elemento especificado, como:
const element = document.querySelector('some-element') element.myFunc() function myFunc() { //do something with element specified before the dot }Pero esto me da un error de que esto no es una función. Lo único que puedo hacer es especificar el elemento como argumento de mi función, así:
const element = querySelector('some-element') myFunc(element) function myFunc(element) { //do something with element } ¿Qué necesito para poder usar mi función a través del punto, como element.myFunction() ?
Solicitó agregar una función como propiedad de un elemento. Ese es un ejemplo:
function myFunc(){ console.log(this); } element.myFunc = myFunc; element.myFunc();No hay nada intrínsecamente malo en simplemente pasar el elemento a la función. Pero si realmente quieres hacer esto...
querySelector devuelve un Element . Entonces podría agregar su función al prototipo de Element . Por ejemplo:
Element.prototype.myFunc = function () { console.log(this); }; const element = document.querySelector('#some-element') element.myFunc(); <div id="some-element">test</div>Sin embargo, vale la pena señalar que adquirir este hábito puede generar problemas. Como se señala en un comentario a continuación, esto "contamina" todos los elementos del DOM. Así que es mejor tener cuidado con este enfoque.