一个可以得到元素真实的背景颜色的javascript脚本_javascript技巧

来源：枫云情感

<html> 
<head> 
<title>得到元素真实的背景颜色 by Longbill</title> 
<style> 
.classname {background-color:#ff99dd;} 
#div3 {background-color:#d8bfd8;} 
div {background-color:#87cefa;border:1px solid #333333;margin:10px;padding:4px;} 
body {background-color:#bed742;} 
#div4 {background-color:transparent;} 
</style> 
</head> 
<body> 
得到元素真实的背景颜色 <font style="font-size:12px;">By Longbill</font> 
div1 直接通过div标签定义背景色(#87cefa) 
div2 通过class name定义背景色(#ff99dd) 
div3 通过id定义背景色(#d8bfd8) 
div4 这是一个透明的div，背景色应为上一个元素的颜色(#bed742) 
<button onclick="go()">getBg()</button> 
 
function getBg(element) 
{//author: Longbill (www.longbill.cn) 
 if (typeof element == "string") element = document.getElementById(element); 
 if (!element) return; 
 cssProperty = "backgroundColor"; 
 mozillaEquivalentCSS = "background-color"; 
 if (element.currentStyle) 
 var actualColor = element.currentStyle[cssProperty]; 
 else 
 { 
 var cs = document.defaultView.getComputedStyle(element, null); 
 var actualColor = cs.getPropertyValue(mozillaEquivalentCSS); 
 } 
 if (actualColor == "transparent" && element.parentNode) 
 return arguments.callee(element.parentNode); 
 if (actualColor == null) 
 return "#ffffff"; 
 else 
 return actualColor; 
} 
function go() 
{ 
 for(var i=1;i<=4;i++) eval("alert('div"+i+":'+getBg('div"+i+"'));"); 
} 
</ script> 
</body> 
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

显示全文

全部频道

一个可以得到元素真实的背景颜色的javascript脚本_javascript技巧