Extending DOM elements

During the development of a site or a web application, it is sometimes very practical to want to use your own methods with the elements of the DOM. A very elegant example is jQuery. In this article I will show you the possible methods to succeed in this extension and then I will try to evaluate them.

Methode n°1 - Extend "Element" : to start we will explain what happens when trying to create a DOM element in Javascript using for example:

var box = document.createElement('DIV');
        

This creation process is done as follows:

document.createElement('DIV');
|
|_ HTMLDIVElement.prototype
    ^
        |_ HTMLElement.prototype
        ^
            |_ Element.prototype
            ^
                |_ Node.prototype
                ^
                    |_ Object.prototype
                    ^
                        |_ null