Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to extend DOM Element as a Class (without jQuery)
    primarykey
    data
    text
    <blockquote> <p><strong>Possible Duplicate:</strong><br> <a href="https://stackoverflow.com/questions/779880/in-javascript-can-you-extend-the-dom">In Javascript, can you extend the DOM?</a> </p> </blockquote> <p>I'm trying to add methods and properties to the Element. It is not listed as a global class. I can extend String like this:</p> <pre><code>String.prototype.dosomething = function { ... }; </code></pre> <p>I try like this (it's bigger, this is the basic):</p> <pre><code>function $id(str){ this.element = document.getElementById(str); return element; } var myElem = $id('myId'); // WORKS !!! $id.prototype.dosomethig = function ( ... }; var myValue = $id('myId').dosomething(); // DOESN'T WORK !!! </code></pre> <p>I try in other ways but the point it's always the same, when I try to extend the class, it doesn't work. Is there a way to avoid this? I know jQuery do this, but I want to do my onwn - if they can, I can... right?</p> <p>Edit: Below a code already working in Safari and Firefox...</p> <pre><code>Element.prototype.pos = function(){ var curleft = this.offsetLeft; var curtop = this.offsetTop; var scrleft = this.scrollLeft; var scrtop = this.scrollTop; var pElement = pElementScr = this.offsetParent while(pElement){ curleft += pElement.offsetLeft; curtop += pElement.offsetTop; pElement = pElement.offsetParent; } while(pElementScr){ scrleft += pElementScr.scrollLeft; scrtop += pElementScr.scrollTop; pElementScr = pElementScr.offsetParent; } return {x:this.offsetLeft, y:this.offsetTop}; } </code></pre> <p>It gives the position of a div even inner of a lot of other divs. I'll try to test in IE8, after solve a lot of other issues of my library.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload