针对Firefox兼容性,要注意的一些问题
来源:互联网 发布:弘毅公考,知乎 编辑:程序博客网 时间:2024/06/17 00:07
本篇内容,主要是个人根据工作中遇到的情况,做个小结。
1、Select列表控件
删除列表项。在IE下工作正常的代码:
obj.options.remove(i);
需要修改为:
添加列表项。在IE下工作正常的代码:
oOption.text = text;
oOption.value = value;
targetArea.options.add(oOption);
为了提供更好的浏览器兼容性,更符合W3C DOM Level 2 HTML标准,建议改为如下代码:
oOption.text = text;
oOption.value = value;
targetArea.options[targetArea.options.length]=new Option(text,value);
另外,selectObj.options(i),需要改为selectObj.options[i]。
2、XmlDom对象
IE下一般这样做:
![](http://images.csdn.net/syntaxhighlighting/OutliningIndicators/None.gif)
为了兼容Firefox,需要修改为:
var xmlDom = new ActiveXObject("Microsoft.XMLDOM");
}
else{
if (document.implementation && document.implementation.createDocument){
var xmlDom = document.implementation.createDocument("","",null);
}
}
3、对于childNodes的循环处理
var sName; //标签文本
var sValue; //标签值
if (nodes.childNodes.length != 0) {
for (var i=0;i<nodes.childNodes.length;++i) {
oItem = nodes.childNodes.item(i);
sName = oItem.text;
sValue = oItem.getAttribute("id"); // 这里会报错
addOption(targetArea,sName,sValue);
}
}
上面这段代码,在IE下完全没有问题,但是在Firefox下就毫无反应,Firefox下的错误控制台报告:oItem没有getAttribute方法,百思不得其解,经调试,发现oItem的节点类型竟然是3,也就是文本,进一步调试得知,oItem的节点类型分别是3、1、3、1....(1是节点对象),使用Firefox的Dom查看器一看,恍然大悟!其中,Xml数据字符串为:
<type id="215">验房服务</type>
<type id="216">家装设计</type>
<type id="217">建筑工程</type>
<type id="218">家装监理</type>
<type id="219">检测(环境质量)</type>
<type id="220">风水</type>
</types>
在Dom查看器中看到:
可以看到,#text节点和节点对象交替排列(id列有数据的为正常节点,例如"验房服务"、"家装设计"等等),造成当oItem为#text类型的时候调用getAttribute()方法失败,因为文本节点没有此方法。
那么,修改后的代码是:
var sName; //标签文本
var sValue; //标签值
var oItem,sName,sValue,oOption;
if (nodes.childNodes.length != 0) {
for (var i=0;i<nodes.childNodes.length;++i) {
var oItem = nodes.childNodes[i];
if(oItem.nodeType == 1){ //判断是否是Element类型
sName = oItem.childNodes[0].nodeValue; //这里需要注意下
sValue = oItem.getAttribute("id");
var oOption = document.createElement('option');
oOption.text = sName;
oOption.value = sValue;
objType.options.add(oOption);
}
}
}
还有一点需要注意的是oItem.text无法在Firefox中取得节点的值,取而代之的是:
oItem.childNodes[0].nodeValue;
至此,真相大白!
附录1:帮助我解决问题的两篇关键文章:
1、http://www.sitepoint.com/forums/showthread.php?t=307056&goto=nextnewest
2、http://www.thescripts.com/forum/thread471907.html
附录2:Node的类型
nodeType Named Constant nodeTypeString nodeName nodeValue 1 ELEMENT_NODE element tagName null 2 ATTRIBUTE_NODE attribute name value 3 TEXT_NODE text #text content of node 4 CDATA_SECTION_NODE cdatasection #cdata-section content of node 5 ENTITY_REFERENCE_NODE entityreference entity reference name null 6 ENTITY_NODE entity entity name null 7 PROCESSING_INSTRUCTION_NODE processinginstruction target content of node 8 COMMENT_NODE comment #comment comment text 9 DOCUMENT_NODE document #document null 10 DOCUMENT_TYPE_NODE documenttype doctype name null 11 DOCUMENT_FRAGMENT_NODE documentfragment #document fragment null 12 NOTATION_NODE notation notation name null- 针对Firefox兼容性,要注意的一些问题
- 针对firefox ie6 ie7 ie8的css样式兼容性
- 一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
- 一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
- 一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
- 一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
- 一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
- 浏览器兼容性相关的一些小问题
- 关于IE浏览器兼容性的一些问题
- 面试时要注意的一些问题
- 面试时要注意的一些问题
- 面试时要注意的一些问题
- 写XML要注意的一些问题
- C语言要注意的一些问题
- shell中要注意的一些问题
- cxfreeze打包要注意的一些问题
- mysql要注意的一些问题
- 使用Xib要注意的一些问题
- 可执行文件分析
- windows 2003防木马的安全设置
- System.StackOverflowException
- mapcontrol不能自动调整大小
- 软件开发平台的设计目标
- 针对Firefox兼容性,要注意的一些问题
- SQL SERVER取出日期型怎么毫秒都丢失了,请教~~http://www.dotnetsky.net/netsave/ShowTopic-41286.html
- 可执行文件分析(2)
- 可执行文件分析(3)
- 可执行文件分析(4)
- 在DataList中绑定表达式将bool值绑定成固定的文本
- 与朋友聊计算机的本质
- 优化 DLL 加载时间性能
- 代码生成器Codematic 2.0 beta