在IE下用getAttribute时要小心
在做DHTML时，我们在某些情况下要用setAttribute(attri, value)方法定义元素的attribute。同时与getAttribute(attri)配对来得到相应的自定义attribute的值。
但在IE下要小心。getAttrubite方法，其官方文档里描述它的返回值是这样说的：
Return Value
Variant. Returns a string, number, or Boolean, defined by sAttrName. If an explicit attribute doesn't exist, an empty string is returned. If a custom attribute doesn't exist, null is returned.
返回值
变体。返回一个定义attribute时的字符串，数字，或者布尔值，如果这个已有属性不存在，则是一个空字符串，如果一个自定义的attribute不存在，则返回null。
Variant. Returns a string, number, or Boolean, defined by sAttrName. If an explicit attribute doesn't exist, an empty string is returned. If a custom attribute doesn't exist, null is returned.
返回值
变体。返回一个定义attribute时的字符串，数字，或者布尔值，如果这个已有属性不存在，则是一个空字符串，如果一个自定义的attribute不存在，则返回null。
下面来做个自定义实验
上面的示例可以看到的确如文档中描述的那样，返回值没有异议。
在select控件中，我们可以用selectObject.value来得到或者设置某个控件的值。比如：
<select id="ctlSelect">
<option value="">- please select -</option>
<option value="1">opt1</option>
<option value="2" selected>opt2</option>
<option value="3">opt3</option>
<option value="4">opt4</option>
</select>
<button onclick="document.getElementById('ctlSelect').value=''">set value</button>
<option value="">- please select -</option>
<option value="1">opt1</option>
<option value="2" selected>opt2</option>
<option value="3">opt3</option>
<option value="4">opt4</option>
</select>
<button onclick="document.getElementById('ctlSelect').value=''">set value</button>
但是将上面两个例子(getAttribute与select)结合起来用的话，效果就与我们想象中的不一样了。
下面的例子是一个select联动的效果，也就是选择第一个select，对应的value会赋值得第二个select上。
（下例中select控件第一个选项是空字符串） 当选中第一个选项时，你会发现第二个select中竟没有任何一个选项被选中。与上例我们所写的示例代码相矛盾。
这个bug的解决方法很简单，只需要我们手工强制转型。但这不得不让我怀疑IE里selectObject.value处理机制。
bug虽小，但却是个不大不小的陷阱，一旦你不小心掉了进去，在大量的代码中寻找这个bug着实会让你头痛。
站长工具
相关文章
请稍等，评论加载中...