得到元素真實的背景顏色的js代碼_javascript技巧

來源：懂視網責編：小采時間：2020-11-27 20:38:30

得到元素真實的背景顏色的js代碼_javascript技巧

得到元素真實的背景顏色的js代碼_javascript技巧: 得到元素真實的背景顏色 .classname {background-color:#ff99dd;} #div3 {background-color:#d8bfd8;} div {background-color:#87cefa;border:1px solid #333333;margin:10px;padding:4px;} body

推薦度：

點擊下載本文 文檔為doc格式

導讀得到元素真實的背景顏色的js代碼_javascript技巧: 得到元素真實的背景顏色 .classname {background-color:#ff99dd;} #div3 {background-color:#d8bfd8;} div {background-color:#87cefa;border:1px solid #333333;margin:10px;padding:4px;} body

<html> 
<head> 
<title>得到元素真實的背景顏色</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> 
<script> 
function getBg(element) 
{//author: Longbill (www.longbill.cn) 
//dnew.cn修補 
 var rgbToHex=function(rgbarray,array){ 
 if (rgbarray.length < 3) return false; 
 if (rgbarray.length == 4 && rgbarray[3] == 0 && !array) return 'transparent'; 
 var hex = []; 
 for (var i = 0; i < 3; i++){ 
 var bit = (rgbarray[i] - 0).toString(16); 
 hex.push((bit.length == 1) ? '0' + bit : bit); 
 } 
 return array ? hex : '#' + hex.join(''); 
 } 
//--------------- 
 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).match(/\d{1,3}/g); 
//----- 
 actualColor = (actualColor) ? rgbToHex(actualColor) : "transparent"; 
 } 
 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需刷新才能執行]

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

得到元素真實的背景顏色的js代碼_javascript技巧

推薦度：

點擊下載本文 文檔為doc格式

標簽：技巧元素的背景

熱門焦點

得到元素真實的背景顏色的js代碼_javascript技巧

得到元素真實的背景顏色的js代碼_javascript技巧

得到元素真實的背景顏色的js代碼_javascript技巧

最新推薦

猜你喜歡

熱門推薦