Extending the DOM
<p>I've recently read that extending the DOM on the whole is bad, because of reasons listed <a href="http://www.nczonline.net/blog/2010/03/02/maintainable-javascript-dont-modify-objects-you-down-own/" rel="nofollow">here</a> and <a href="http://perfectionkills.com/whats-wrong-with-extending-the-dom/" rel="nofollow">here</a>. As I understand it, the main reasons against it are:</p>

<ul>
<li>It doesn't work very well/at all in IE </li>
<li>It is possible to run into conflict, such as if a framework uses <code>Document.prototype.hide</code> and a browser then implements a <code>hide</code> function on document elements</li>
<li>Browsers implement things in wildly different ways</li>
</ul>

<p>However, I haven't seen anyone ask these questions. </p>

<ol>
<li>If I wanted to extend the DOM, how would I do it safely? Besides the
obvious use of a wrapper, how would I natively add a function, such
as <code>hide</code> to the DOM as a whole, safely? </li>
<li>If it's not possible to implement it safely, what are the specific
    reasons? Can I implement checks, such as checking <code>typeof
    Document.prototype.hide == 'undefined'</code> before implementing my own
    function on the prototype?</li>
</ol>

<p>In other words, explain to me how I can extend the DOM safely and what I could do to make sure that if a browser were to make the <code>hide</code> function, what I could do to not make my code have to be completely reworked. </p>
