Storing custom data in dom elements

Question

Is this wrong? If so why?

var elm = document.getElementById("myElm");
elm.customValue = {attr1 : "test", attr2 : "test"};

I understand how to use the data attributes, but I don't want to muddy up my dom with all those attributes.

Answer 1

This introduces a memory leak in some browsers because you bind a native C object (the DOM element) and a JS object together and some garbage collection algorithms cannot deal with this. IE is one of them.

Here is an MSDN article about IE memory leaks: http://msdn.microsoft.com/en-us/library/ie/bb250448(v=vs.85).aspx