JS对IE下表单元素name和id不同步的取值异常BUG03/08/2009

JS对IE下表单元素name和id不同步的取值异常BUG03/08/2009

随着小生与IE的交往越来越深入，这个并不陌生的老朋友的坏脾气也一天一天的被挖掘出来，尽管她试图遮遮掩掩，蒙混过关……
这次的bug出在一个表单验证上，我用javascript对用户的输入进行客户端验证，由于需要在之前已经完工的表单上加入一个新的元素来显示一些额外信息，意外的，我将这个元素的id取了一个和之前已经存在的表单元素的name相同的名字，我的表单验证使用document.forms['form_name'].elements['element_name']来定位元素，因此未给之前的任何元素id属性。呼呼！bug就这样出现了，当我们验证之前元素的checkd属性时，总是返回undefined，这实在太奇怪了！我们将其与SVN中的上个版本比较，发现只是增加了一个元素，回溯到上个版本，一切正常，问题就在这个元素上了，我们去除了这个新增元素的id属性，表单验证的js代码又能工作了。
     今天，我仔细研究了一下这个问题，发现：只要表单元素的id和name值不同，即会引发javascript取元素不准确的bug，最后我还发现form.elements['element_name']取表单元素如果id和name相同的值却指向不同的元素，该方法居然只能返回undefined，不管在ie还是firefox、opera下。
     看我做的一个示例来重现这个bug吧，我故意将第一个元素的id和第二个元素的name值设为相同，第二个元素的name等于第一个元素的id，而第三、四两个元素的设置是正常的，接着使用了三种方法：getElementById、getElementsByName、elements来获得value，结果在ie6、ie7下，无论是使用getElementById还是getElementsByName都不能取到第二个元素(文本框)的value，在ff、opera下却都能正常工作。