javascript实例：精确获取元素css属性值

[内容提要]　　　如何实现javascript精确获取元素css属性值？当处理DOM元素的CSS属性时，我们经常会遇到一个问题：明明页面上已经定义了CSS属性值，但在获取的时候却为空，这是因为任何样式表文件或内联CSS预设的样式信息并不能可靠地反映到style属性上，本文向你介绍准确获...

作者: 优内科技来源: 优内科技驻站日期:2009/8/17 【加入收藏】【打印此页】【关闭】

　　如何实现javascript精确获取元素css属性值？当处理 DOM 元素的 CSS 属性时，我们经常会遇到一个问题：明明页面上已经定义了 CSS 属性值，但在获取的时候却为空，这是因为任何样式表文件或内联 CSS 预设的样式信息并不能可靠地反映到 style 属性上，本文向你介绍准确获取指定元素 CSS 属性值的方法。

代码如下：

Source Code to Run

<!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=gb2312" />
<title>javascript实例：精确获取元素css属性值--中国IT人才网!IT求职,IT招聘</title>
</head>
<style type="text/css">
.container{ width:980px; margin:30px auto;}
.e_tit{ margin:10px; font-size:13px; font-weight:bold;}
#e_con{ margin:10px; border:1px #CCCCCC solid; line-height:60px; text-align:center; background-color:#dddddd;}
.e_btn,.e_write{ margin:10px;}
.e_write li{ list-style:none; padding:2px 0; float:left; width:100%;}
</style>
<body>
<div class="container">
	<div class="e_tit">javascript实例：精确获取元素css属性值</div>
	<div id="e_con">要获取背景颜色的元素</div>
	<div class="e_write">
<SCRIPT type=text/javascript>
<!--
// 说明：准确获取指定元素 CSS 属性值
// 作者：John Resig 《Pro JavaScript Techniques》
// 来源：52css
// 整理：will2011 (http://www.51itrencai.com)

[可先修改部分代码再运行查看效果]

收藏到网摘：