Javascript不同浏览器差异及兼容方法
原文链接: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不同浏览器差异及兼容方法的更多相关文章
- 几个JavaScript的浏览器差异处理问题
JQuery确实是个很好用的库,你可以不用考虑很多细节方面的事情.但很作为一个web前端,处理和了解浏览器差异一个重要问题.下面将介绍一些总结,先介绍没有使用js库的情况. 1. setAttribu ...
- 巧妙使用CSS媒体查询(Media Queries)和JavaScript判断浏览器设备类型的好方法
有无数的理由要求我们在任何时候都应该知道用户是使用的什么设备浏览我们的网站——宽屏,普通屏,平板,手机?知道这些特征,我们web应用的CSS和JavaScript才能同步做相应的操作.在给Mozill ...
- JavaScript获取浏览器信息的方法
Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息. JavaScript代码如下: ? 1 2 3 4 5 6 7 8 9 10 11 1 ...
- Javascript常见浏览器兼容问题
常见浏览器原生javascript兼容性问题主要分为以下几类: 一.Dom 1.获取HTML元素,兼容所有浏览器方法:document.getElementById("id")以I ...
- 总结JavaScript中浏览器的兼容问题
浅析JavaScript中浏览器的兼容问题 浏览器兼容性问题是在实际开发中容易忽略而又最重要的一部分.我们在讲老版本浏览器兼容问题之前,首先要了解什么是能力检测,它是来检测浏览器有没有这种能力,即判断 ...
- placeholder兼容方法(兼容IE8以上浏览器)
//placeholder兼容方法(兼容IE8以上浏览器) var JPlaceHolder = { //检测 _check: function () { return 'placeholder' i ...
- JS--事件对象中部份浏览器不兼容方法
测试时主要用的浏览器是Firefox 28.0.IE11.IE8.Chrome 34.0 一.什么是事件对象:当触发某个事件的时候,会产生一个事件对象,这个对象包含着所有的与事件有关的信息,包括导致 ...
- JavaScript在浏览器中把文本保存为文件的方法
JavaScript在浏览器中把文本保存为文件的方法 经过测试第二种方法可以保存更多的文本不至于卡死 var saveTextAsFile1 = function (text, fileName, s ...
- Javascript 字符串浏览器兼容问题
先看下不兼容的写法,若我想获取某个字符串的第几位 var str='aavvvcc'; console.info(str[0]); 这种写法 在IE 7以下的浏览器都不兼容,以下提供浏览器全兼容的方式 ...
随机推荐
- Linux 中我该如何备份系统
系统备份概述 在前面的一些文章中,我反复提到经常会把系统搞崩溃,所以备份系统就是一件不容忽视的事情.由于 Linux 系统本身的优越性,系统的备份和还原还是比较容易的.主要表现在以下方面: Linux ...
- DataTable转换成IList<T>的简单实现
DataTable的无奈 很多时候,我们需要去操作DataTable.但DataTable的操作,实在是太不方便了.Linq?lambda表达式?统统没有... 特别是对现有结果集做进一步筛选,这样的 ...
- 如何开发一款堪比APP的微信小程序(腾讯内部团队分享)
一夜之间,微信小程序刷爆了行业网站和朋友圈,小程序真的能如张小龙所说让用户"即用即走"吗? 其功能能和动辄几十兆安装文件的APP相比吗? 开发小程序,是不是意味着移动应用开发的一次 ...
- jQuery UI与jQuery easyUI的冲突解决办法
jQuery UI与jQuery easyUI都是基于jQuery开发的.难免里面会有些方法名冲突! 因此对jQuery.easyui其中的两个方法名:resizable 和 draggable进行替 ...
- PowerDesigner(数据建模)使用大全
什么是PowerDesigner 引入百度百科的说法是: power designer是能进行数据库设计的强大的软件,是一款开发人员常用的数据库建模工具.使用它可以分别从概念数据模型(Conceptu ...
- FWaaS 实践: 允许 ssh - 每天5分钟玩转 OpenStack(119)
上一节应用了无规则的虚拟防火墙,不允许任何流量通过. 今天我们会在防火墙中添加一条规则,允许 ssh.最后我们会对安全组和 FWaaS 作个比较. 下面我们添加一条 firewall rule:允许 ...
- PHP资源列表
一个PHP资源列表,内容包括:库.框架.模板.安全.代码分析.日志.第三方库.配置工具.Web 工具.书籍.电子书.经典博文等等. 初始翻译信息来自:<推荐!国外程序员整理的 PHP 资源大全& ...
- SpringMVC一路总结(一)
SpringMVC听闻已久,早在去年就被学长问到关于SpringMVC的基础知识,当时也没在意.主要是工作中也没有用到关于SpringMVC的技术,因此免于没有时间和精力的借口就没有接触和学习Spri ...
- 深入浅出JavaScript之this
JavaScript中的this比较灵活,根据在不同环境下,或者同一个函数在不同方式调用下,this都有可能是不同的.但是有一个总的原则,那就是this指的是,调用函数的那个对象. 下面是我的学习笔记 ...
- react-native ListView使用详解
刚好今天七夕,呆萌的程序猿没有妹纸,刚好发小明天结婚,我还在异地,晚上还要苦逼的赶火车.趁着下午比较闲,更新一下Blog,也算是在百无聊赖之时给众多单身程序猿们的小福利吧,虽然已经好久没更了...囧 ...