当前位置:编程学习 > html/css >>

style 和 currentStyle 区别分析

 代码如下 复制代码

<!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" />
<style type="text/css">
p{color:#0F0;}
#text{color:#FF0;}
</style>
<title>test</title>
</head>

<body>
<p id="text"> hello world </p>

<script>
var ldd={
 
 getStyle:function(obj,prop){return obj.style[prop];},
 getCurrentStyle:function(obj,prop){
  if(obj.currentStyle){return obj.currentStyle[prop];}      //IE
  if(document.defaultView){return document.defaultView.getComputedStyle(obj,null)[prop];}   //非 IE
  }

 };
var obj=document.getElementById("text");

obj.style 返回通过 STYLE 标签属性应用到元素的内嵌样式,此种样式权重最大,为1000。因为<p>中没有内嵌样式,故而第一个alert 不显示任何内容。
obj.currentStyle (IE 特有,w3c标准方法为 document.defaultView.getComputedStyle)返回的是浏览器当前使用的属性,由于<p> 中没有内嵌样式,根据css 权重,最终使用的color  是#text 中的样式,即color:#FF0。 所以第二个alert显示的内容为"#F00"。

补充:Css教程,常用代码 
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,