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以下的浏览器都不兼容,以下提供浏览器全兼容的方式 ...
随机推荐
- 弄了一个支持SSL的TCP客户端
近日需要做一些TCP的收发的调试,到网上去找TCP调试工具,找了好几款,发现不是功能不全就是不支持HEX,更重要的SSL也不支持,于是动手写了一款,叫TCPRunner,有以下特性: 使用异步IO方式 ...
- 06. Web大前端时代之:HTML5+CSS3入门系列~HTML5 画布
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 我们先看看画布的魅力: 初始画布 canvas默认是宽3 ...
- MVC5 网站开发之七 用户功能 2 用户添加和浏览
目录 MVC5网站开发之一 总体概述 MVC5 网站开发之二 创建项目 MVC5 网站开发之三 数据存储层功能实现 MVC5 网站开发之四 业务逻辑层的架构和基本功能 MVC5 网站开发之五 展示层架 ...
- ASP.NET Core 中文文档 第二章 指南(1)用 Visual Studio Code 在 macOS 上创建首个 ASP.NET Core 应用程序
原文:Your First ASP.NET Core Application on a Mac Using Visual Studio Code 作者:Daniel Roth.Steve Smith ...
- TeamCity : Build 版本控制系统配置
VCS (版本控制系统) 是用来跟踪项目源文件版本变化的系统.它还有其它的名字,比如 SCM(源代码管理).当前 TeamCity 内置支持的 VCS 类型有:Git, Subversion, Mer ...
- angularjs和ajax的结合使用 (一)
好久没写文了.这是一篇关于easyui配合ajax使用 的文章, 顺带介绍angularjs的使用 以及让你感受到angularjs的威力.网上对于ajax 的文也是多如牛毛 .我就不直接 从那种原生 ...
- React Native图片控件的使用
首先定义组件 import { AppRegistry, StyleSheet, Text, View, Image,} from 'react-native'; 然后将render返回中的模版增加I ...
- 在浏览器标签显示网站logo图标
在网站根目录下添加favicon.ico文件,并在网页添加如下代码: <link rel="bookmark" href="~/favicon.ico" ...
- Interview website
https://www.interviewcake.com http://www.leetcode.com
- Node.js的Formidable模块的使用
今天总结了下Node.js的Formidable模块的使用,下面做一些简要的说明. 1) 创建Formidable.IncomingForm对象 var form = new formidab ...