展会信息港展会大全

style 和 currentStyle 区别分析
来源:互联网   发布日期:2016-03-25 16:15:07   浏览:3456次  

导读:这里介绍一下关于style 和 currentStyle 区别分析,有需要的朋友可以参考一下。代码如下复制代码 <!DOCTYPE html PUBLIC ...

这里介绍一下关于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"。

赞助本站

人工智能实验室

相关热词: 开发 编程 android

AiLab云推荐
推荐内容
展开

热门栏目HotCates

Copyright © 2010-2024 AiLab Team. 人工智能实验室 版权所有    关于我们 | 联系我们 | 广告服务 | 公司动态 | 免责声明 | 隐私条款 | 工作机会 | 展会港