原文链接:http://caibaojian.com/js-ie-different-from-firefox.html

javascript的各种兼容就是为了解决不同浏览器的差异性,了解其中的差异能够帮助你更快的解决问题,提高代码的使用质量,编写更优秀的javascript代码。

1.window.event

表示当前的时间对象,IE有这个对象,FF没有,FF通过给事件处理函数传递事件对象

2.获取事件源

IE用srcElement获取事件源,而FF用target获取事件源

以上两个兼容通常会这么写:

var evt = e||event;

var el = evt.srcTarget || evt.srcElement;

3.添加、去除事件

4.获取标签的自定义属性

IE:div1.value或div1['value']

FF:可用div1.getAttribute("value")

5.document.getElemntByName()和document.all[name]

IE不可以,

FF可以

6.input.type的属性

7.IE支持innerText、outerHTML

FF:支持textContent

8.窗口的位置

IE、chrome、safari:支持使用window.screenLeft和window.screenTop

IE8以上、chrome、safari、firefox:支持使用window.screenX和window.screenY

兼容代码可以使用下面这段代码:

var leftX = typeof window.screenLeft == 'number' ? window.screenLeft : window.screenX;

ver topY = typeof window.screenTop == 'number' ? window.screenTop : window.screenY;

9.窗口的大小

firefox、chrome、IE9和safari:window.innerWidth和window.innerHeight

IE系列:document.body.clientWidth和document.body.clientHeight

不是IE6:document.documentElement.clientWidth和document.documentElement.clientHeight

兼容代码可以这样子写

//code from http://caibaojian.com/js-ie-different-from-firefox.html
var width = window.innerWidth; var height = window.innerHeight; if(typeof width != 'number'){ if(document.compatMode == 'CSS1Compat'){ width = document.documentElement.clientWidth; height = document.docuementElement.clientHeight; }else{ width = document.body.clientWidth; height = document.body.clientHeight; }

以上内容参考网络,由于本人学习的javascript知识还比较少,暂时不认识,所以提前学习,以便以后遇到能够快速的识别。这篇文章后面将会继续更新添加。

Javascript不同浏览器差异及兼容方法的更多相关文章

  1. 几个JavaScript的浏览器差异处理问题

    JQuery确实是个很好用的库,你可以不用考虑很多细节方面的事情.但很作为一个web前端,处理和了解浏览器差异一个重要问题.下面将介绍一些总结,先介绍没有使用js库的情况. 1. setAttribu ...

  2. 巧妙使用CSS媒体查询(Media Queries)和JavaScript判断浏览器设备类型的好方法

    有无数的理由要求我们在任何时候都应该知道用户是使用的什么设备浏览我们的网站——宽屏,普通屏,平板,手机?知道这些特征,我们web应用的CSS和JavaScript才能同步做相应的操作.在给Mozill ...

  3. JavaScript获取浏览器信息的方法

    Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息. JavaScript代码如下: ? 1 2 3 4 5 6 7 8 9 10 11 1 ...

  4. Javascript常见浏览器兼容问题

    常见浏览器原生javascript兼容性问题主要分为以下几类: 一.Dom 1.获取HTML元素,兼容所有浏览器方法:document.getElementById("id")以I ...

  5. 总结JavaScript中浏览器的兼容问题

    浅析JavaScript中浏览器的兼容问题 浏览器兼容性问题是在实际开发中容易忽略而又最重要的一部分.我们在讲老版本浏览器兼容问题之前,首先要了解什么是能力检测,它是来检测浏览器有没有这种能力,即判断 ...

  6. placeholder兼容方法(兼容IE8以上浏览器)

    //placeholder兼容方法(兼容IE8以上浏览器) var JPlaceHolder = { //检测 _check: function () { return 'placeholder' i ...

  7. JS--事件对象中部份浏览器不兼容方法

    测试时主要用的浏览器是Firefox 28.0.IE11.IE8.Chrome 34.0  一.什么是事件对象:当触发某个事件的时候,会产生一个事件对象,这个对象包含着所有的与事件有关的信息,包括导致 ...

  8. JavaScript在浏览器中把文本保存为文件的方法

    JavaScript在浏览器中把文本保存为文件的方法 经过测试第二种方法可以保存更多的文本不至于卡死 var saveTextAsFile1 = function (text, fileName, s ...

  9. Javascript 字符串浏览器兼容问题

    先看下不兼容的写法,若我想获取某个字符串的第几位 var str='aavvvcc'; console.info(str[0]); 这种写法 在IE 7以下的浏览器都不兼容,以下提供浏览器全兼容的方式 ...

随机推荐

  1. Java基础知识(壹)

    写在前面的话 这篇博客,是很早之前自己的学习Java基础知识的,所记录的内容,仅仅是当时学习的一个总结随笔.现在分享出来,希望能帮助大家,如有不足的,希望大家支出. 后续会继续分享基础知识手记.希望能 ...

  2. GitHub实战系列~2.把本地项目提交到github中 2015-12-10

    GitHub实战系列汇总:http://www.cnblogs.com/dunitian/p/5038719.html ———————————————————————————————————————— ...

  3. Hybrid App技术批量制作APP应用与跨平台解决方案

    前言 简单的聊一聊我开发了4年之久的Hybrid App(混合模式移动应用)平台开发,目前一直在持续开发与维护,支持无编程快速开发! 其本意也不是要吹捧前端有多么强大,只是用自己的实际项目阐述下对于前 ...

  4. 【译】Unity3D Shader 新手教程(4/6) —— 卡通shader(入门版)

    本文为翻译,附上原文链接. 转载请注明出处--polobymulberry-博客园. 暗黑系 动机 如果你满足以下条件,我建议你阅读这篇教程: 你想了解更多有关表面着色器的细节知识. 你想实现一个入门 ...

  5. YunCart电商网站支付宝接口出现500错误

    yuncart 是一套易与集成的php开源商城系统,方便多人同时经行二次开发,Yuncart 可以以非常方便的方式切换到sql server,oracle等数据库,大小1.9MB,感兴趣的朋友,可以去 ...

  6. Java 二叉树遍历右视图-LeetCode199

    题目如下: 题目给出的例子不太好,容易让人误解成不断顺着右节点访问就好了,但是题目意思并不是这样. 换成通俗的意思:按层遍历二叉树,输出每层的最右端结点. 这就明白时一道二叉树层序遍历的问题,用一个队 ...

  7. Vertica 7.1安装最佳实践(RHEL6.4)

    一.前期准备工作 1.1各节点IP和主机名 1.2上传脚本并设定环境变量 1.3添加信任 1.4前期准备检查并调整 二.Vertica安装 三.集群性能评估 一.前期准备工作: 1.1各节点IP和主机 ...

  8. 一个可随意定位置的带色Toast——开源代码Crouton的简单使用

    今天在公司要求的代码中,要求显示的提示能够更加具有多样化,而不是简单的Toast字样,第一想法肯定是自定义View呀,结果在浏览中发现还有这样的一个开源代码——Crouton. 几经折腾,发现这个东西 ...

  9. Python(六)面向对象、异常处理、反射、单例模式

    本章内容: 创建类和对象 面向对象三大特性(封装.继承.多态) 类的成员(字段.方法.属性) 类成员的修饰符(公有.私有) 类的特殊成员 isinstance(obj, cls) & issu ...

  10. PHPStorm配置自己喜欢的主题

    PHPstorm默认的主题和可选的主题有时候不能满足有些人的需求,怎么配置自己喜欢的主题呢? 1.首先先去下载自己喜欢的主题:http://www.phpstorm-themes.com/ 但是在下载 ...