获取元素样式 currentStyle 和 getcomputedStyle
2024-08-28 18:49:22
场景
你要获取某一元素的样式,可是没有获取到,返回的值为undefined,可是有时候又能成功?
为什么?
因为,xx.stly.xxx 可以获取的样式信息,是dom元素style属性里的样式,对于通过<style>标签,或外部样式表定义的,我们就无法获取了。当然,js给予的也是dom。
怎么办?
dom标准里有个全局方法 getComputedStyle 。可以获取到当前对象样式规则信息,这还不算完,因为IE不支持。。。
IE有自己的 currentStyle 所以,你要兼容他们,怎么做?
代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
body,html{
height: 100%;
}
body{
background-color:red;
background-image:url(实验.png)
}
</style>
</head>
<body>
<div id="div1" style=''></div>
</body>
<script type="text/javascript">
window.onload = function(){
function t (obj,sx) {
if(obj.currentStyle){
return obj.currentStyle[sx];
}else{
return getComputedStyle(obj,false)[sx];
}
}
var body =document.getElementsByTagName('body');
body[0].style.backgroundImage ="url(实验.png)";
alert(t(body[0],"backgroundColor"));
}
</script>
</html>
大家可以试试。
最新文章
- backup2
- WeedFS依赖库 0.6.1
- ruby on rails爬坑(三):图片上传及显示
- C# 正则表达式测试工具与分享窗体自适应类
- 每日Scrum--No.8
- 琐碎-关于hadoop2.2.0
- hdu 1272
- CSS属性一览
- 下载的firebug-lite压缩包的调用方法
- [Unity3D]Unity3D游戏开发Android内嵌视图Unity查看
- SQL Server从远程服务器导入数据
- Jmeter实现dubbo接口压测案例
- HDU1237
- orcal - 添加用户、授权
- python基础之IO编程
- nginx记录post body/payload数据
- 运行msckf_vio
- 自制 Chrome Custom.css 设置网页字体为微软雅黑扩展
- eg_8
- count distinct
热门文章
- Kooboo中怎么写Page Plugin -摘自官方文档
- 学习Visitor Pattern 有感而发!override and overload
- BZOJ 3280: 小R的烦恼 &; BZOJ 1221: [HNOI2001] 软件开发
- 新建虚拟SAN
- 远程使用Gpupdate(Hash,哈希)
- CardsTube/YouTubePlaylist
- Android 颜色渲染(六) RadialGradient 环形渲染
- cocos2d-x之CCMotionStreak类&mdash;&mdash;2013-08-25 16
- html 笔记
- js验证