1.event.srcElement

复制代码 代码如下:
//srcElement只能在IE下使用target是FireFox使用的,下面是兼容性写法
var obj = e.srcElement ? e.srcElement : e.target;

2.e.originalEvent.x

复制代码 代码如下:
// e.originalEvent.x 只能在IE下使用,FireFox只能使用e.originalEvent.layerX,下面是兼容性写法
var positionX = e.originalEvent.x - $(this).offset().left || e.originalEvent.layerX - $(this).offset().left || 0;

3.windows.event
window.event只能在IE下运行,而不能在Firefox下运行,
这是因为Firefox的event只能在有事件发生的情况下使用
IE:

复制代码 代码如下:
<input type="button" value="测试IE下的Event" onclick="test1()"/>
<input type="button" value="测试Event的兼容性" onclick="test2()"/>
<script language="javascript">

function test1() {
alert(window.event); //使用 window.event
}
function test2(evt) {
evt=evt?evt:(window.event?window.event:null);
alert(evt); //使用参数evt
}
</script>

以下是一个例子：
在画面上点击回车时，不触发事件，但是在TextArea这样的框中点击回车触发事件。大家可以修改代码，以供自己使用：

复制代码 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>s</title>
<script language="javascript">

document.onkeydown=keypage

function keypage(e) {

eevt=e?e:(window.event?window.event:null);

if (evt.keyCode==13) {

if (window.XMLHttpRequest) { // IE7 FF MO
//alert(( evt ? evt.explicitOriginalTarget : null).tagName)

if(( evt ? evt.explicitOriginalTarget : null).tagName =="TEXTAREA"){
var obj = evt ? evt.explicitOriginalTarget : null;
alert("ID:="+obj.id)
}
} else { // IE6
if(document.activeElement.type== "textarea") {
var obj = document.activeElement
alert("ID:="+obj.id)
}
}
}
} </script>

</head>
<body>

<input id="test1"type="text" >
<br>
<input id="test2" type="text" >
<br>
<input id="test3" type="button" >
<br>
<textarea id="test4"></textarea>

</body>
</html>

4.innerText

复制代码 代码如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>关注一下IE和Firefox的兼容性</title>
</head>
<script language="javascript">

function testInnerText(){
if(navigator.appName.indexOf("Explorer") > -1){
document.getElementById('element').innerText = "my text";
} else{
document.getElementById('element').textContent = "my text";
}
} </script>
<body>
<input name="Button" type="button" value="testInnerText" onclick="javascript:testInnerText()"/>
<div id="element" style="border:1px solid #0066CC; width:100px; height:50px"></div>
</body>
</html>

5.CSS "float" 属性

获取给定对象的特定 CSS 属性的基本语法是 object.style 属性，而且有连字符的属性要用骆驼命名法来代替。例如，获取一个 ID 为 "header" 的 div 的 background-color 属性，我们要用如下语法：

document.getElementById("header").style.borderBottom= "1px solid #ccc";

但是由于 "float" 是 JavaScript 的保留词，我们就无法使用 object.style.float 来获取 "float" 属性了。一下是我们在两种浏览器中的使用的方法：

IE 语法：

document.getElementById("header").style.styleFloat = "left";

Firefox 语法：

document.getElementById("header").style.cssFloat = "left";
6.元素的计算样式

通
过使用上述的 object.style.property， JavaScript 可以很容易的获取和修改对象的设定 CSS
样式。但是这一语法的局限在于，它只能取得内联在 HTML 里的样式，或者直接使用 JavaScript 设定的样式。style
对象不能获取使用外部样式表设定的样式。为了获取对象的"计算样式"，我们使用以下代码：

IE 语法：

复制代码 代码如下:
var myObject = document.getElementById("header");
var myStyle = myObject.currentStyle.backgroundColor;

Firefox 语法：

复制代码 代码如下:
var myObject = document.getElementById("header");
var myComputedStyle = document.defaultView.getComputedStyle(myObject, null);
var myStyle = myComputedStyle.backgroundColor;

7.获取元素的"class"属性

类似于"float"属性的情况，这两种浏览器使用不同的 JavaScript 方法来获取这个属性。

IE 语法：

复制代码 代码如下:
var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("className");

Firefox 语法：

复制代码 代码如下:
var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("class");

8.获取 label 标签的 "for" 属性

和 3 一样，使用 JavaScript获取 label 的 "for" 属性也有不同语法。

IE 语法：

复制代码 代码如下:
var myObject = document.getElementById("myLabel");
var myAttribute = myObject.getAttribute("htmlFor");

Firefox 语法：

复制代码 代码如下:
var myObject = document.getElementById("myLabel");
var myAttribute = myObject.getAttribute("for");

对于 setAtrribute 方法来说也是同样的语法。

9.获取光标位置

获
取元素的光标位置比较少见，如果需要这么做，IE 和 Firefox
的语法也是不同的。这个示例代码是相当基础的，一般用作许多复杂事件处理的一部分，这里仅用来描述差异。需要注意的是，IE 中的结果和 Firefox
中是不同的，因此这个方法有些问题。通常，这个差异可以通过获取 "滚动位置" 来补偿 － 但那是另外一篇文章的课题了。

IE 语法：

复制代码 代码如下:
var myCursorPosition = [0, 0];
myCursorPosition[0] = event.clientX;
myCursorPosition[1] = event.clientY;

Firefox 语法：

复制代码 代码如下:
var myCursorPosition = [0, 0];
myCursorPosition[0] = event.pageX;
myCursorPosition[1] = event.pageY;

10.获取视窗或浏览器窗口的尺寸

有时需要找出浏览器的有效窗口空间的尺寸，一般成为"视窗"。

IE 语法：

复制代码 代码如下:
var myBrowserSize = [0, 0];
myBrowserSize[0] = document.documentElement.clientWidth;
myBrowserSize[1] = document.documentElement.clientHeight;

Firefox 语法：

复制代码 代码如下:
var myBrowserSize = [0, 0];
myBrowserSize[0] = window.innerWidth;
myBrowserSize[1] = window.innerHeight;

11.Alpha 透明

嗯，
这其实不是 JavaScript 的语法项目 - alpha 透明是通过 CSS 来设置的。但是当对象通过 JavaScript
设置为淡入淡出时，这就需要通过获取 CSS 的 alpha 设定来实现，一般是在循环内部。要通过以下 JavaScript 来改变 CSS
代码：

IE 语法：

复制代码 代码如下:
#myElement {
filter: alpha(opacity=50);
}

Firefox 语法：

复制代码 代码如下:
#myElement {
opacity: 0.5;
}

要使用 JavaScript 获取这些值，需要使用 style 对象：

IE 语法：

复制代码 代码如下:
var myObject = document.getElementById("myElement");
myObject.style.filter = "alpha(opacity=80)";

Firefox 语法：

复制代码 代码如下:
var myObject = document.getElementById("myElement");
myObject.style.opacity = "0.5″;

当然，已经说到了，一般是在循环中间来改变 opcity/alpha，来创建动画效果，但这这是个简单的例子，只是为了明白地描述方法是如何实现地。

JS在IE和FireFox之间常用函数的区别小结的更多相关文章

  1. php正规则表达式学习笔记（几个常用函数的区别）

    preg_mache()函数和 preg_mache_all()函数的区别: preg_mache()只会匹配规则中的字符一次, preg_mache_all()会匹配符合条件的所有字符! 例子对比: ...

  2. JS设置浏览器缓存，以及常用函数整理

    //设置缓存 function set_cache(key,value){ if(key=='') return false; localStorage.setItem(key, value); } ...

  3. JQuery常用函数及功能小结

    1.文档加载完成执行函数$(document).ready(function(){  alert("开始了");});2.添加/删除CSS类$("#some-id&quo ...

  4. JQuery常用函数及功能小结－－转载

    1.文档加载完成执行函数 $(document).ready(function(){  alert("开始了"); }); 2.添加/删除CSS类 $("#some-id ...

  5. 字符串函数 mysql 和sqlserver 中对于字符串的常用函数和区别

    1. 对于字符串大小写的统一 mysql和sqlserver中都有同名函数lower()和upper(),但是mysql中还有另外一对函数,达到同样的目的,lcase()和ucase(),也就是英文中 ...

  6. js 关于height()、innerHeight()、outerHeight()函数的区别

  7. js 页面刷新location.reload和location.replace的区别小结

    reload 方法,该方法强迫浏览器刷新当前页面. 语法: location.reload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前 ...

  8. js 正则常用函数 会正则得永生

    正则表达式作为一种匹配处理字符串的利器在很多语言中都得到了广泛实现和应用,web开发本质上是处理字符串(服务端接受请求处理后拼接字符串作为响应,这在早期的CGI编程中最明显,然后客户端解析字符串进行渲 ...

  9. JQuery常用函数及功能

    JQuery常用函数及功能小结 来源:http://blog.csdn.net/screensky/article/details/7831000 1.文档加载完成执行函数 $(document).r ...

随机推荐

  1. jquery设置元素的readonly和disabled

    jquery设置元素的readonly和disabled Jquery的api中提供了对元素应用disabled和readonly属性的方法,在这里记录下.如下: $( '#line2Tr' ).cs ...

  2. bdb log为什么 有 region buffer 和 log cursor buf

    对bdb log来说, 在共享内存中 有一块 buffer, 同时每一个 log cursor 都自带一个 malloc的buf. why? 我认为: region buffer存的是log最末尾, ...

  3. android studio导入jar的两种方式

    一.第一种是打开工程所在Project Structure,然后选择Dependencies,点击那个加号选择File Dependency ,然后再Libs文件夹中选择要导入的jar包 1. 2. ...

  4. 解决Win7下VC6.0插入ActiveX控件对话框为空的问题

    在Win7环境下,编写MFC应用程序,Project菜单下Add To Project子菜单中的 Components and Controls…选项,在弹出的对话框中Gallery文件为空,也就无法 ...

  5. Export GridView Data to Excel. 从GridView导出数据到Excel的奇怪问题解析

    GridView导出函数内容如下 string attachment = "attachment; filename=Contacts.xls";            Respo ...

  6. HTML5的文档结构和新增标签

    一．HTML5 文档结构1.第一步:打开 开发工具,打开指定文件夹:2.第二步:保存 index.html 文件到磁盘中,.html 是网页后缀:3.第三步:开始编写 HTML5 的基本格式.< ...

  7. Android JIT实时编译器的设置

    在Android  JIT实时编译是在Android 2.2之后才引入的,JIT编译器可以显著的提高机器的性能,经过测试,android 2.2的性能较android 2.1提高了 2-5倍.JIT提 ...

  8. go程序注册为windows服务

    cmd下运行:nssm install 服务名 go打包好的exe文件 nssm下载地址:http://nssm.cc/,将下载好nssm.exe放到/windows/system32文件夹下

  9. Word发布博客测试

    /// <summary> /// Main相当于Windows服务的Start方法 主要负责初始化的工作 /// </summary> /// <param name= ...

  10. Python--命令行参数解析Demo

    写没有操作界面的程序时,最讨厌的就是参数解析问题,尤其是很多参数那种,下面是一个小Demo,拿出来与各位分享: # -*- coding:utf8 -*- import os import datet ...