FF和IE之间7个JavaScript的差异第1/2页

这篇文章中，我会略述一下 Internet Explorer 和 Firefox 在 JavaScript 语法上不同的 7 个方面。

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 方法来说也是同样的语法。

当前1/2页 12下一页阅读全文

赞 (0)

相关推荐

  • IE与Firefox下javascript getyear年份的兼容性写法

    IE与Firefox下javascript getyear年份不同浏览器 JavaScript 的getyear年份函数兼容性问题 先举个例子 用 Firefox 上一些网站会看到这样的提示 现在时间是 106年8月8日 而用 ie 浏览器的话就显示正常的 2006年8月8日 原因就是 javascript 的兼容性问题 var today = new date(); var year = today.getYear(); 在 Firefox 里面 getYear 返回的是 "当前年份-1900

  • 测试IE浏览器对JavaScript的AngularJS的兼容性

    短版本 为确保Angular应用在IE上能够工作请确认: 1. 在IE7或更早的版本上polyfill JSON.stringify.你可以使用JSON2或JSON3来polyfills. <!doctype html> <html xmlns:ng="http://angularjs.org"> <head> <!--[if lte IE 7]> <script src="/path/to/json2.js"&

  • FF和IE之间7个JavaScript的差异第1/2页

    这篇文章中,我会略述一下 Internet Explorer 和 Firefox 在 JavaScript 语法上不同的 7 个方面. 1. CSS "float" 属性 获取给定对象的特定 CSS 属性的基本语法是 object.style 属性,而且有连字符的属性要用骆驼命名法来代替.例如,获取一个 ID 为 "header" 的 div 的 background-color 属性,我们要用如下语法: document.getElementById("

  • JavaScript实现的原生态Tab标签页功能【兼容IE6】

    JavaScript实现的原生态Tab标签页功能【兼容IE6】

    本文实例讲述了JavaScript实现的原生态Tab标签页功能.分享给大家供大家参考,具体如下: 标签页是一个很常见的东西,在一些框架中也就很常见的, 但未必所有人都知道怎么写,很多人知道怎么在网上复制一份是真的, 这样不好,往往需要用大量的时间去修改网上复制下来的东西,还不如自己写一份快. 一.基本目标 创建一个如下的标签页,在IE8中与谷歌浏览器中的效果如下,几乎没有区别 谷歌浏览器: IE8: 二.制作过程 1.首先布置好场景,在一个图层内: 图层1~图层4四个超级链接是一个图层,然后各自

  • javaScript+turn.js实现图书翻页效果实例代码

    javaScript+turn.js实现图书翻页效果实例代码

    为了实现图书翻页的效果我们在网上可以看到很多教程 在这里推荐turn.js 网上的turn.js 有api 不过是英文的  很多人看起来不方便 .关于代码也是奇形怪状在这里我将详细讲解如何使用turn.js实现翻页效果 ,本篇文章只是讲解 turn.js 如何使用!!!!!!! 文章最后提供源码下载,结合源码看本文,turn.js更简单! 首先附上个人的文件路径 对于css   和 js文件不需要过多的解释   在这里要注意的是pages文件夹   这里个文件夹下放的是需要预览的图片文件   

  • 基于JavaScript实现在新的tab页打开url

    当window.open(url,"_blank"),无效时,可用如下方法. function openwin(url) { var a = document.createElement("a"); a.setAttribute("href", url); a.setAttribute("target", "_blank"); a.setAttribute("id", "cam

  • JavaScript框架编程第1/2页

    使用JavaScript框架 在讲述 window 对象的时候,我们提到过,一个框架内的网页也是 window 对象,也就是说,Frame 对象也是 window 对象.用最容易理解的话说,每一个 HTML 文件占用一个 window 对象,包括定义框架的网页("框架网页").在 IE 里用"<iframe>"标记在文档中插入的框架也是 window 对象,但是用"包含网页"的方法(在 HTML 中显示为"<!--we

  • 开发跨浏览器的JavaScript方法说明第1/2页

    开发跨浏览器的JavaScript 1. childNodes在ff中和ie的区别. ff中的node(nodeType = 1)都是用textNode(nodeType = 3)分开的,而ie/op不是这样的. <div id="box1"><span>content</span></div> 在ff下,box1的childNodes为3个,ie下为1个. 2. 设置某个node对象的style class名称. ie中要设置某个nod

  • 初学JavaScript第一章第1/2页

    JavaScript的数据类型 Number:整形,浮点型 String:字符型数据,JavaScript不区分单个字符和字符串, 任何字符或字符串都可以用又引号或单引号引起来. Boolean:布尔型 Undefined:未定义类型,用于不存在或者没有被赋初值的变量或对象的属性如: var name;此时的name即为Undefined Null:空值,一般将Undefined型和Null型等同对待 Function:函数,可以通过new操作符和构造函数Function()来动态创建所需要功能

  • javascript正则表达式分析第1/2页

    什么是正则表达式? 这个问题可以参见:"正则表达式30分钟入门教程",很多编程语言都支持正则表达式,本文仅仅讨论JavaScript中的正则表达式. 创建一个正则表达式 第一种方法: 复制代码 代码如下: var reg = /pattern/; 第二种方法: 复制代码 代码如下: var reg = new RegExp('pattern'); 正则表达式的exec方法简介 语法: reg.exec(str); 其中str为要执行正则表达式的目标字符串. 例如: 复制代码 代码如下:

  • 多浏览器兼容的动态加载 JavaScript 与 CSS第1/2页

    在介绍ensure内部的实现之前,让我们先来看看其功能: ensure({ html: "popup.html", javascript: "popup.js", css: "popup.css" }, function() { Popup.show("hello world"); } ); 在这段代码中,ensure首先会确保popup.html.popup.js.popup.css这3个文件的加载,如果都没加载过ensur

  • 对于IE7、FF、OP清除浮动的最优方法第1/2页

    对于IE7、FF、OP清除浮动的最优方法第1/2页

    在CSS森林群里讨论一个margin的问题中无意间发现overflow也可以用来清除浮动,嘿嘿,这个方法不单使用简单,而且FF.OP.IE7都支持,从此可以告别那又长兼容性又差的FF清浮动的方法了. 方法真的很简单,只要为需要清浮动的标签加上overflow这个属性.  css代码 复制代码 代码如下: ul{ list-style:none; height:auto; margin:0;p adding:0; background-color:#436973; } li{ float:left

随机推荐