资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
得到元素真实的背景颜色的js代码
<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> <span style="text-align:center;font-size:20px;color:#ff7f50;width:100%;">得到元素真实的背景颜色 <font style="font-size:12px;">By <a href=http://longbill.cn target=_blank>Longbill</a></font></span> <div id='div1'>div1 直接通过div标签定义背景色(#87cefa)</div> <div id='div2' class=classname>div2 通过class name定义背景色(#ff99dd)</div> <div id='div3'>div3 通过id定义背景色(#d8bfd8)</div> <div id='div4'>div4 这是一个透明的div,背景色应为上一个元素的颜色(#bed742)</div> <button onclick="go()">getBg()</button> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3E%20%20%0D%0Afunction%20getBg(element)%20%20%0D%0A%7B%2F%2Fauthor%3A%20Longbill%20(www.longbill.cn)%20%20%0D%0A%2F%2Fdnew.cn%E4%BF%AE%E8%A1%A5%20%20%0D%0A%20%20var%20rgbToHex%3Dfunction(rgbarray%2Carray)%7B%20%20%0D%0A%20%20%20%20%20%20if%20(rgbarray.length%20%3C%203)%20return%20false%3B%20%20%0D%0A%20%20%20%20%20%20if%20(rgbarray.length%20%3D%3D%204%20%26%26%20rgbarray%5B3%5D%20%3D%3D%200%20%26%26%20!array)%20return%20'transparent'%3B%20%20%0D%0A%20%20%20%20%20%20var%20hex%20%3D%20%5B%5D%3B%20%20%0D%0A%20%20%20%20%20%20for%20(var%20i%20%3D%200%3B%20i%20%3C%203%3B%20i%2B%2B)%7B%20%20%0D%0A%20%20%20%20%20%20%20%20var%20bit%20%3D%20(rgbarray%5Bi%5D%20-%200).toString(16)%3B%20%20%0D%0A%20%20%20%20%20%20%20%20hex.push((bit.length%20%3D%3D%201)%20%3F%20'0'%20%2B%20bit%20%3A%20bit)%3B%20%20%0D%0A%20%20%20%20%20%20%7D%20%20%0D%0A%20%20%20%20%20%20return%20array%20%3F%20hex%20%3A%20'%23'%20%2B%20hex.join('')%3B%20%20%0D%0A%20%20%20%20%7D%20%20%0D%0A%2F%2F---------------%20%20%0D%0A%20%20if%20(typeof%20element%20%3D%3D%20%22string%22)%20element%20%3D%20document.getElementById(element)%3B%20%20%0D%0A%20%20if%20(!element)%20return%3B%20%20%0D%0A%20%20cssProperty%20%3D%20%22backgroundColor%22%3B%20%20%0D%0A%20%20mozillaEquivalentCSS%20%3D%20%22background-color%22%3B%20%20%0D%0A%20%20if%20(element.currentStyle)%20%20%0D%0A%20%20%20%20var%20actualColor%20%3D%20element.currentStyle%5BcssProperty%5D%3B%20%20%0D%0A%20%20else%20%20%0D%0A%20%20%7B%20%20%0D%0A%20%20%20%20var%20cs%20%3D%20document.defaultView.getComputedStyle(element%2C%20null)%3B%20%20%0D%0A%20%20%20%20var%20actualColor%20%3D%20cs.getPropertyValue(mozillaEquivalentCSS).match(%2F%5Cd%7B1%2C3%7D%2Fg)%3B%20%20%0D%0A%2F%2F-----%20%20%0D%0A%20%20%20%20actualColor%20%3D%20(actualColor)%20%3F%20rgbToHex(actualColor)%20%3A%20%22transparent%22%3B%20%20%0D%0A%20%20%7D%20%20%0D%0A%20%20if%20(actualColor%20%3D%3D%20%22transparent%22%20%26%26%20element.parentNode)%20%20%0D%0A%20%20%20%20return%20arguments.callee(element.parentNode)%3B%20%20%0D%0A%20%20if%20(actualColor%20%3D%3D%20null)%20%20%0D%0A%20%20%20%20return%20%22%23ffffff%22%3B%20%20%0D%0A%20%20else%20%20%0D%0A%20%20%20%20return%20actualColor%3B%20%20%0D%0A%7D%20%20%0D%0Afunction%20go()%20%20%0D%0A%7B%20%20%0D%0A%20%20for(var%20i%3D1%3Bi%3C%3D4%3Bi%2B%2B)%20eval(%22alert('div%22%2Bi%2B%22%3A'%2BgetBg('div%22%2Bi%2B%22'))%3B%22)%3B%20%20%0D%0A%7D%20%20%0D%0A%3C%2Fscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程