架构深渊

慢慢走进程序的深渊……关注领域驱动设计、测试驱动开发、设计模式、企业应用架构模式……积累技术细节,以设计架构为宗。
  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

[转]FF和IE之间7个JS的差异

Posted on 2009-10-30 15:33  chen eric  阅读(333)  评论(0编辑  收藏  举报

 

尽管 JS 古代事件上应用冗长而令一生厌的代码Code块来标的特定浏览器的时期已经结束了,但是偶尔应用一部份简单的代码Code块和对象检查测试来确保一部份代码Code在用户机器上正常务工依然是必要的。
这篇文字作品中,我会略述一下 Internet Explorer 和 Firefox 在 JS 语句语言规则上不相同的 
7 个方面。
1. CSS 样式表 “float” 属性
获取给定对象的特定 CSS 样式表 属性的基本语句语言规则是 object.style 属性,而且有连字符的属性要用骆驼命名法来代替。例如,获取唯一 ID 为 “header” 的 div 的 background
-color 属性,咱们要用如下语句语言规则: 
document.getElementById(
"header").style.borderBottom= "1px solid #ccc";
但是由于 “
float” 是 JS 的保留词,咱们就无法应用 object.style.float 来获取 “float” 属性了。一下是咱们在两种浏览器中的应用的窍门:
IE 语句语言规则:
document.getElementById(
"header").style.styleFloat = "left";
Firefox 语句语言规则:
document.getElementById(
"header").style.CSS 样式表Float = "left";
2. 元素的计算样式
经过应用上述的 object.style.property, JS 能够很简易的获取和改正对象的设定 CSS 样式表 样式。但是这一语句语言规则的局限在于,它只能取得内联在 HTML 里的样式,或者直接应用 JS 设定的样式。style 对象别获取应用外部CSS 样式表设定的样式。为了获取对象的”计算样式”,咱们应用以下代码Code:
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”属性的情况,这两种浏览器应用不相同的 JS 窍门来获取那个属性。
IE 语句语言规则:
var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("className");
Firefox 语句语言规则:
var myObject = document.getElementById("header");
var myAttribute = myObject.getAttribute("class");