- 浏览: 1600206 次
- 性别:
文章分类
- 全部博客 (2929)
- 非技术 (18)
- Eclipse (11)
- JAVA (31)
- 正则表达式 (0)
- J2EE (4)
- DOS命令 (2)
- WEB前端 (52)
- JavaScript (69)
- 数据库 (8)
- 设计模式 (0)
- JFreechart (1)
- 操作系统 (1)
- 互联网 (10)
- EasyMock (1)
- jQuery (5)
- Struts2 (12)
- Spring (24)
- 浏览器 (16)
- OGNL (1)
- WebService (12)
- OSGi (14)
- 软件 (10)
- Tomcat (2)
- Ext (3)
- SiteMesh (2)
- 开源软件 (2)
- Hibernate (2)
- Quartz (6)
- iBatis (2)
最新评论
尽管 JavaScript 历史上使用冗长而令人生厌的代码块来标的特定浏览器的时期已经结束了,但是偶尔使用一些简单的代码块和对象检测来确保一些代码在用户机器上正常工作依然是必要的。
这篇文章中,我会略述一下 Internet Explorer 和 Firefox 在 JavaScript 语法上不同的几 个方面。
1. 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"; |
2. 元素的计算样式
通过使用上述的 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; |
3. 获取元素的”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"); |
4. 获取 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 方法来说也是同样的语法。
5. 获取光标位置
获取元素的光标位置比较少见,如果需要这么做,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;
发表评论
-
Javascript评估用户输入密码的强度的方法 代码
2009-07-28 17:50 680用Javascript评估用户输入密码的强度密码已经是我们生活 ... -
15款基于浏览器扩展的WEB开发工具
2009-07-29 08:44 746WEB开发工具的使用已经 ... -
WEB 服务器调试利器 -- Tamper Data(转)
2009-07-29 08:53 726一. 简介 作为 Firefox 的插件, T ... -
图片和文字放一起,不能居中的解决方法
2009-07-29 14:47 922<td align="center" ... -
解开JavaScript生命的达芬奇密码
2009-08-05 17:56 714解开JavaScript生命的达芬奇密码 ——如何使用Jav ... -
掌控上传进度的AJAX Upload(转贴)
2009-08-05 17:59 690掌控上传进度的AJAX Uploa ... -
Javascript跨域访问解决方案
2009-08-11 20:11 621由于安全方面的考虑,Javascript被限制了跨域访问的能力 ... -
不唐突的JavaScript的七条准则(转载)
2009-08-12 13:18 611经过多年的开发、教学 ... -
浅谈Javascript中的事件流和事件绑定
2009-08-13 16:31 756事件流 浏览器中的事 ... -
JavaScript继承详解(二)
2009-08-17 17:04 597转自:http://www.cnblogs.com/sansh ... -
JavaScript继承详解(一)
2009-08-17 17:04 671转自:http://www.cnblogs.com/sansh ... -
javascript实用技巧--数组.
2009-08-17 17:08 634数组和字符串类型对象的方法我特容易搞混淆,所以把他列出来,免得 ... -
常见的JavaScript错误
2009-08-17 17:19 712作者: Richardy, 出处:IT ... -
JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度
2009-08-17 17:19 633网页可见区域宽:document.body.clientWid ... -
Javascript的Defer属性
2009-08-17 17:48 674Script中的Defer属性 ... -
最佳的"addEvent"是怎样诞生的
2009-08-18 13:47 616IE的 JScript 存在内存泄露的bug 想必大家都清楚或 ... -
值得推荐的事件捕获函数AddEvent()
2009-08-18 13:56 7421, 下面是JQuery之父推荐的添加移除事件方法。 ... -
随滚动条移动的层
2009-08-20 15:55 709<!DOCTYPE html PUBLIC &qu ... -
javascript 获取滚动条高度
2009-08-20 16:02 763/******************** * 取窗口滚动 ... -
如何去掉ie里面的关闭按钮,和屏蔽ALT+F4 (转载)
2009-09-01 17:46 761去掉关闭按钮可以使用无边框窗口设计,不过IE6中已经不支持了。 ...
相关推荐
详细讲解IE和Firefox中css和javascript的差异和兼容!
Javascript在IE和FireFox中的不同表现,总结IE和火狐的差异。
主要为大家详细介绍了IE和Firefox之间在JavaScript语法上的差异,在JavaScript语法上不同的7个方面,感兴趣的小伙伴们可以参考一下
总结一部分IE和Firefox的javascript差异写法,对于像书写多浏览器兼容性更好的代码,可以参考下。
为此,主要从以下几方面差异总结IE和Firefox的Javascript兼容性: 一、函数和方法差异; 二、样式访问和设置; 三、DOM方法及对象引用; 四、事件处理; 五、其他差异的兼容处理。 一、函数和方法差异 1. getYear()...
尽管那需要用长串的、沉闷的不同分支代码来应付不同浏览器的日子已经过去,偶尔还是有必要做一些简单的区分和目标检测来确保某块代码能在用户的机器上正常运行。
我们经常在处理ie和firefox下的js总会碰到一些兼容问题,下面是些总结,希望大家仔细看看研究
这篇文章中,我会略述一下 Internet Explorer 和 Firefox 在 JavaScript 语法上不同的 7 个方面。 1. CSS “float” 属性 获取给定对象的特定 CSS 属性的基本语法是 object.style 属性,而且有连字符的属性要用骆驼...
为此,主要从以下几方面差异总结IE和Firefox的Javascript兼容性: 代码如下:一、函数和方法差异;二、样式访问和设置;三、DOM方法及对象引用;四、事件处理;五、其他差异的兼容处理。 一、函数和方法差异 1. ...
这也造成了在不同的浏览器中处理event的差异,这里结合一些零碎的代码来说明如何做到event在IE4+和Firefox下的正常工作。首先看如下代码: 代码如下: function doEventThing(eventTag){ var event = eventTag||...
document.documentElement.scrollTop在Chrome里总为0document.body.scrollTop 在IE和firefox里总为01、各浏览器下 window.pageYOffset/document.documentElement.scrollTop/document.body.scrollTop的差异示例:...
现在我把正则表达式在五大主流浏览器(IE、Firefox、Chrome、Safari、Opera,以当前版本为准)之间的差异整理一下罗列出来,给大家,也算给我自己做一个备忘。 1、Firefox和Chrome会过度优化在循环(以及其中内嵌的...
主要介绍了jQuery 中DOM 操作详解,以及在火狐和IE之间的13点JavaScript差异,需要的朋友可以参考下
1,IE6/7/8/9中无事件(如click,mouseover),Firefox/Safari/Chrome/Opera则有。 代码如下: <select id=”s1″ multiple=”multiple”> ”1″ xss=removed>1</option> ”2″ xss=removed>2</option> </...