`
lison5566
  • 浏览: 16345 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

跨浏览器兼容问题

阅读更多
1、浏览器兼容问题主要在CSS上,其次才是JS处理的问题。
浏览器兼容性问题处理很复杂,首先得考虑支持JS的浏览器与不支持JS的浏览器的问题,
其次得考虑不同类型的浏览器问题如:IE和FIREFOX,再次需要考虑同一类型浏览器不同版本的问题。

2、根据浏览器的特性做判断,如只有IE支持actionx控件,因此只要判断ActiveXObject函数就可以了
firefox中的dom元素都有getboxobjectfor函数,用来获取该元素的位置和大小。
opera有专门的标志window.opera
safari有openDatabase函数

<script type="text/javascript">
        var Sys = {};
        var ua = navigator.userAgent.toLowerCase();
        if (window.ActiveXObject)
            Sys.ie = ua.match(/msie ([\d.]+)/)[1]
        else if (document.getBoxObjectFor)
            Sys.firefox = ua.match(/firefox\/([\d.]+)/)[1]
        else if (window.MessageEvent && !document.getBoxObjectFor)
            Sys.chrome = ua.match(/chrome\/([\d.]+)/)[1]
        else if (window.opera)
            Sys.opera = ua.match(/opera.([\d.]+)/)[1]
        else if (window.openDatabase)
            Sys.safari = ua.match(/version\/([\d.]+)/)[1];
       
        //以下进行测试
        if(Sys.ie) document.write('IE: '+Sys.ie);
        if(Sys.firefox) document.write('Firefox: '+Sys.firefox);
        if(Sys.chrome) document.write('Chrome: '+Sys.chrome);
        if(Sys.opera) document.write('Opera: '+Sys.opera);
        if(Sys.safari) document.write('Safari: '+Sys.safari);

    </script>
3、可以通过http请求头中的User-Agent字段来判断浏览器的类型和版本。
4、可以使用HTML的注释符号来包裹JS以和谐掉不支持JS浏览器的问题
5、在使用sctipt标签的时候由于有多个脚本语言如:javascript、vbsctipt等,因此建议明确指明language,并且指明JS版本有利于解决JS低

版本不支持某些语法的问题,javasctipt1.5
6、如果实在没办法提供JS服务了,那么可以使用<nosctipt>标记提示用户浏览器无法正确显示页面
7、除非绝对必须,否则不应该使用浏览器检测这个方法,因为他具有不准确性而且嵌套的if判断等大量判断语句会导致程序扩展性、阅读性以

及运行效率下降。必须使用浏览器检查一般是传递到方法的参数在浏览器之间执行不同的解释。
你还可以使用jquery的浏览器判断函数$.browser,它可以判断浏览器甚至版本。也可以使用$.boxModel来判断方框模型,$.styleFloat。
8、良好的跨浏览器编程应该是对在平时经验的积累中获知到哪些语句兼容性强,针对性的解决某些兼容问题。尽量选用兼容性强的JS语法表现

方式,如getElementById()而非document.forms[0].id;
某些JS函数增加有效性判断,如if(!windows.opener){xxx}else{xxxx}对浏览器是否支持opener函数进行了判断;又如针对EVENT的兼容,标准

事件模型定义addEventListener方法而IE为attachEvent()那么就针对性的编写
if(element.attachEvent){element.attachEvent('onclick',xxxx);}else if(element.addEventListener){element.addEventListener

('click',xxxx);}else{throw new Error('xxxx');} and so on...
分享到:
评论

相关推荐

    跨浏览器兼容CSS篇

    ### 跨浏览器兼容CSS篇:实现一致性的策略与技巧 #### 一、引言 在Web设计领域,确保网站在不同浏览器中呈现一致的效果是一项挑战性任务。由于各种浏览器对CSS的支持程度不尽相同,开发者经常面临布局差异的问题。...

    基于捕获_重放的Web应用跨浏览器兼容性检测.pdf

    1. 跨浏览器兼容性问题(Cross-Browser Issues,简称XBI)是指Web应用在不同浏览器平台上的不兼容问题。 2. 捕获_重放技术是一种记录和重现用户交互事件的技术,可以用于检测跨浏览器兼容性问题。 3. X-CHECK是一种...

    跨浏览器兼容的CSS代码编程方法

    然而,在实际开发中,由于不同浏览器对CSS的支持程度不同,导致了跨浏览器兼容性问题成为了一个长期困扰开发者的问题。本文将详细介绍如何编写跨浏览器兼容的CSS代码,并分享一些实用的技巧。 #### 二、CSS兼容性的...

    css浏览器兼容问题大全

    【CSS浏览器兼容问题详解】 在Web开发中,CSS(层叠样式表)是用于控制网页元素样式的关键技术,但它在不同浏览器之间的兼容性问题一直是开发者面临的挑战。尤其是针对老版本的Internet Explorer(如IE7、IE6)和...

    跨浏览器解决方案

    在IT行业中,跨浏览器兼容性是开发者经常面临的一项挑战。标题“跨浏览器解决方案”提示我们,这个主题将探讨如何确保应用程序或网站在不同浏览器上都能正常运行和展示。描述中的“NULL”没有提供额外信息,但我们...

    c++实现跨浏览器插件

    2. **跨浏览器兼容性**:NPAPI最初是为了实现跨平台和跨浏览器兼容而设计的,可以在Firefox、Chrome(旧版本)、Safari(旧版本)和Opera等浏览器中运行。 3. **插件开发**:开发者需要为每个支持的浏览器实现NPAPI...

    浏览器兼容问题处理

    在前端开发中,浏览器兼容问题一直是开发者面临的一大挑战。不同的浏览器对某些JavaScript语法、DOM操作以及CSS样式的支持程度不尽相同,这导致了在不同浏览器下可能出现功能差异或者页面渲染问题。以下是一些常见的...

    跨浏览器兼容性问题.docx

    综上所述,跨浏览器兼容性问题需要开发者对各种浏览器的行为有深入理解,并采取相应的策略来确保网站在所有平台上的表现一致和良好。通过遵循最佳实践、使用兼容性工具和持续测试,可以有效地管理和减少这些问题带来...

    css和js的浏览器兼容问题汇总

    总的来说,解决CSS和JavaScript的浏览器兼容问题需要开发者对各种浏览器的特性有深入理解,并善于运用工具和技巧进行调试和优化。如使用Firebug、Web Developer、DebugBar等开发工具可以帮助开发者快速定位和解决...

    js浏览器兼容问题的大全

    "js浏览器兼容问题的大全"这个主题涵盖了如何处理这些挑战的关键知识点。 首先,JavaScript的兼容性问题主要涉及IE(Internet Explorer)、Firefox(Firefox)、Chrome、Safari和Opera等主流浏览器之间的差异。例如...

    javascript解决浏览器兼容性问题

    为了确保跨浏览器兼容性,我们需要编写能够适配不同浏览器环境的代码。 ##### 2.1 创建XMLHttpRequest对象的通用方法 ```javascript var xmlhttp; // 创建XMLHTTPRequest对象 function createXMLHTTPRequest() { ...

    跨浏览器兼容CSS篇整理.pdf

    跨浏览器兼容性是Web开发中的一个关键议题,尤其是在CSS领域。由于不同的浏览器对CSS标准的实现存在差异,设计师和开发者需要采取策略确保网站在不同浏览器上表现一致。本文主要聚焦于CSS的跨浏览器兼容性,特别是...

    浏览器兼容代码大全

    ### 浏览器兼容代码大全 #### 概述 本文档提供了一系列的代码示例,旨在...无论是通过CSS技巧、特殊的选择器还是条件注释,都可以有效地提高网站的跨浏览器兼容性。希望这些知识能够帮助你更好地进行前端开发工作。

    跨浏览器兼容的HTML5视频音频播放器

    "跨浏览器兼容的HTML5视频音频播放器"正是为了解决这个问题而设计的。 首先,让我们了解一下HTML5的`&lt;video&gt;`和`&lt;audio&gt;`标签。这两个标签允许开发者直接在网页中嵌入视频或音频内容,而无需依赖Flash等外部插件。...

    良田高拍仪跨浏览器控件SDKV2.3.0

    1. **浏览器兼容性**:此版本的SDK特别强调对Chrome浏览器的支持,意味着用户无需下载安装额外的客户端软件,就能在浏览器上直接使用高拍仪进行文档扫描、拍照等操作。此外,可能还支持其他主流浏览器如Firefox、...

    用于跨浏览器网页编程

    通过合理地使用JavaScript来检测浏览器类型和版本,结合标准化的编码习惯以及适当的工具和技术,可以有效地解决跨浏览器兼容性问题。希望本文提供的示例代码和技巧能帮助开发者更好地应对实际项目中的挑战。

    浏览器兼容测试工具

    浏览器兼容性测试是Web开发过程中不可或缺的一环,因为不同的浏览器可能会有不同的解析标准和实现方式,导致同一段...在实际开发中,结合使用多种测试方法和工具,能够更全面地解决问题,确保产品的跨浏览器兼容性。

    Zero Clipboard 利用 Flash 进行复制 跨浏览器兼容

    标题"Zero Clipboard 利用 Flash 进行复制 跨浏览器兼容"指出,这是一个关于使用Zero Clipboard库实现跨浏览器的文本复制功能的技术。Zero Clipboard是一款开源JavaScript库,它通过利用Flash技术来解决浏览器之间的...

    关于各种浏览器兼容问题,希望对大家有些帮助

    本文将针对标题和描述中提及的“浏览器兼容问题”进行详尽的探讨。 浏览器兼容性问题主要体现在以下几个方面: 1. **渲染引擎差异**:不同的浏览器采用不同的渲染引擎,如Chrome使用Blink,Firefox使用Gecko,...

Global site tag (gtag.js) - Google Analytics