Properly adding 'name' and 'id' to an element

[darknkreepy3#]

Internet Explorer allows you to accidentally call elements in your html with crossed identification properties. For instance, if you wanted to call the menu of your html area, 'menu' and then reference it in Javascript, IE would allow this:

<div name="menu">testing</div>
<div name="debug">debug area</div>
<script type="text/javascript" language="javascript">
var menu=document.getElementById('menu');
var debug=document.getElementById('debug');
debug.innerHTML=menu.innerHTML;
</script>

Firefox and other browsers would not spit out 'testing' into the debug div when run. When you getElementById, yo uneed to define the element's actual 'id' not 'name' which in your mind can bridge as the same thing, a semantic, but it is not. Here is the correct way to name your elements for a JS reference:

<div id="menu">testing</div>
<div id="debug">debug area</div>
<script type="text/javascript" language="javascript">
var menu=document.getElementById('menu');
var debug=document.getElementById('debug');
debug.innerHTML=menu.innerHTML;
</script>

this will produce 'testing' in the debug area in both IE and FF, and all compliant browsers.