document.getElementById取值异常
日期：2014-05-16 浏览次数：20348 次
document.getElementById取值错误
在页面中存在name和Id属性相同的情况下，为什么document.getElementById属性取到的元素是前者呢？
代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script type= "text/javascript ">
function spread( code){
alert( "getById: " + document.getElementById( "code1 ").value);
var targetCode = document.getElementById(code.name);
//alert(code.value);
}
</script>
</HEAD>
<BODY id= "body ">
<select name= "code1 " style= "width: 120px " onChange= "return spread(this); " id= "select ">
<option value= "1 " id= "op1 "> JBoss </option>
<option value= "2 " id= "op1 "> Red Hat </option>
<option value= "3 " id= "op1 "> Sun </option>
</select>
<input type= "hidden " id= "code1 " value= "soncode1 ">
<input id= "3 " type= "hidden " value= "hidden ">
</BODY>
</HTML>
为什么alert取到的值不是 soncode1 呢？
------解决方案--------------------
这个似乎是IE的BUG吧?
当有name和id相同时,getElementById会先抓在前边出现的.
FF就不会
------解决方案--------------------
这是IE的一个BUG，使用FIREFOX就没有问题
------解决方案--------------------
IE的BUG
lz可以用一个自定义属性来传值
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script type= "text/javascript ">
function spread( code){
alert( "getById: " + document.getElementById(code.hidden_name).value);
//var targetCode = document.getElementById(code.hidden_name);
//alert(code.value);
}
</script>
</HEAD>
<BODY id= "body ">
<select hidden_name= "code1 " style= "width: 120px " onChange= "return spread(this); " id= "select ">
<option value= "1 " id= "op1 "> JBoss </option>
<option value= "2 " id= "op1 "> Red Hat </option>
<option value= "3 " id= "op1 "> Sun </option>
</select>
<input type= "hidden " id= "code1 " value= "soncode1 ">
<input id= "3 " type= "hidden " value= "hidden ">
</BODY>
</HTML>
在页面中存在name和Id属性相同的情况下，为什么document.getElementById属性取到的元素是前者呢？
代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script type= "text/javascript ">
function spread( code){
alert( "getById: " + document.getElementById( "code1 ").value);
var targetCode = document.getElementById(code.name);
//alert(code.value);
}
</script>
</HEAD>
<BODY id= "body ">
<select name= "code1 " style= "width: 120px " onChange= "return spread(this); " id= "select ">
<option value= "1 " id= "op1 "> JBoss </option>
<option value= "2 " id= "op1 "> Red Hat </option>
<option value= "3 " id= "op1 "> Sun </option>
</select>
<input type= "hidden " id= "code1 " value= "soncode1 ">
<input id= "3 " type= "hidden " value= "hidden ">
</BODY>
</HTML>
为什么alert取到的值不是 soncode1 呢？
------解决方案--------------------
这个似乎是IE的BUG吧?
当有name和id相同时,getElementById会先抓在前边出现的.
FF就不会
------解决方案--------------------
这是IE的一个BUG，使用FIREFOX就没有问题
------解决方案--------------------
IE的BUG
lz可以用一个自定义属性来传值
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN ">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script type= "text/javascript ">
function spread( code){
alert( "getById: " + document.getElementById(code.hidden_name).value);
//var targetCode = document.getElementById(code.hidden_name);
//alert(code.value);
}
</script>
</HEAD>
<BODY id= "body ">
<select hidden_name= "code1 " style= "width: 120px " onChange= "return spread(this); " id= "select ">
<option value= "1 " id= "op1 "> JBoss </option>
<option value= "2 " id= "op1 "> Red Hat </option>
<option value= "3 " id= "op1 "> Sun </option>
</select>
<input type= "hidden " id= "code1 " value= "soncode1 ">
<input id= "3 " type= "hidden " value= "hidden ">
</BODY>
</HTML>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
