【免费】WEB浏览器兼容推荐收藏资源-CSDN文库

需积分: 0 85 浏览量 2020-12-10 18:21:59 上传评论收藏 91KB PDF 举报

并不一定全，有的也可能不准确，比如新出的IE8、 Chrome等都没有太多涉及，虽然最近做的一些项目也兼容了IE8、Chrome等，但都没来的及总结进去，后来就忘了…汗。大家一起慢慢完善吧。javascript部分1. document.form.item 问题问题：代码中存在 document.formName.item(“itemName”) 这样的语句，不能在FF下运行解决方法：改用 document.formName.elements[“elementName”]2. 集合类对象问题问题：代码中许多集合类对象取用时使用()，IE能接受，FF不能解决方法：改用 [] 作为下标运算，例：【WEB浏览器兼容性问题及其解决方案】在Web开发中，确保网页在不同的浏览器上表现一致是一项重要的任务。由于各个浏览器在实现标准和非标准特性时可能存在差异，因此开发者常常需要面对浏览器兼容性问题。以下是一些常见的JavaScript和HTML相关的问题及对应的解决策略，主要针对IE和Firefox（FF）之间的差异。 1. **`document.form.item`问题**： - 问题：`document.formName.item("itemName")`在FF中不支持。 - 解决方法：替换为`document.formName.elements["elementName"]`。 2. **集合类对象问题**： - 问题：FF不接受集合类对象使用()``作为访问方式。 - 解决方法：改为使用`[]`作为下标运算，如`document.getElementsByName("inputName")(1)`应改为`document.getElementsByName("inputName")[1]`。 3. **`window.event`问题**： - 问题：FF中`window.event`无法在事件外部使用。 - 解决方法：将`event`作为参数传递给函数，并在内部处理。例如： ```javascript onMouseMove = "functionName(event)"; function functionName(e) { e = e || window.event; ... } ``` 4. **ID作为对象名的问题**： - 问题：在IE中，HTML对象的ID可以直接作为`document`的子对象，FF不行。 - 解决方法：始终使用`getElementById("idName")`来获取对象。 5. **通过ID字符串取得对象**： - 问题：IE中可以用`eval("idName")`获取ID为`idName`的对象，FF不支持。 - 解决方法：用`getElementById("idName")`代替`eval("idName")`。 6. **变量名与HTML对象ID相同的问题**： - 问题：FF允许变量名与HTML对象ID相同，IE不行。 - 解决方法：声明变量时使用`var`关键字以避免歧义，或者避免使用与HTML对象ID相同的变量名。 7. **`event.x`和`event.y`问题**： - 问题：IE有`event.x`和`event.y`，FF没有。 - 解决方法：FF中用`event.pageX`代替`event.x`，但为兼容IE，使用`event.clientX`。 8. **frame问题**： - 问题：IE中可以通过`window.testFrame`访问frame，FF不行。 - 解决方法：在FF中，使用`window.top.document.getElementById("testFrame").src`或`window.top.frameName.location`。 9. **获取元素属性**： - 问题：FF需要使用`getAttribute()`获取自定义属性。 - 解决方法：在FF中使用`getAttribute()`，在其他浏览器中直接访问属性。 10. **`parentElement`和`children`问题**： - 问题：FF使用`parentNode`和`childNodes`，而IE使用`parentElement`和`children`。 - 解决方法：使用`parentNode`和`childNodes`，但注意FF的`childNodes`可能包含空白文本节点，可以使用`getElementsByTagName()`避免。 11. **`const`关键字问题**： - 问题：IE不支持`const`关键字。 - 解决方法：使用`var`替代`const`。 12. **`body`对象问题**： - 问题：FF的`body`对象在`<body>`标签未完全加载时不可用。 - 解决方法：使用`window.onload`或`DOMContentLoaded`事件确保在文档加载完成后操作`body`对象。以上只是Web浏览器兼容性问题的一部分，实际开发中可能还会遇到更多。解决这些问题的关键是遵循W3C标准，同时使用条件注释、polyfill库以及工具如Babel和autoprefixer来自动处理浏览器差异。记住，持续学习和测试是保持网站跨浏览器兼容性的关键。

资源详情

资源评论

资源推荐