js 獲取計算后的樣式寫法及注意事項
更新時間：2013年02月25日 16:52:57 作者：
復合樣式：currentStyle;注意在獲取復合樣式時要單獨寫,不能寫background,接下來將詳細介紹下實現(xiàn)方法，感興趣的你可不要錯過了哈
currentStyle
1.復合樣式：currentStyle取不到
例：background、margin
2.取默認樣式
3.只能讀
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>獲取計算后的樣式</title>
<style type="text/css">
#div1{ height:100px; background:#069;}
</style>
<script type="text/javascript">
//兼容
function getStyle(obj, name)
{
if(obj.currentStyle)
{
return obj.currentStyle[name];
}
else
{
return getComputedStyle(obj, false)[name];
}
}
window.onload=function()
{
var oDiv=document.getElementById('div1');
alert(getStyle(oDiv, 'width'));
alert(getStyle(oDiv, 'backgroundColor')); //注意在獲取復合樣式時要單獨寫，不能寫background
};
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
1.復合樣式：currentStyle取不到
例：background、margin
2.取默認樣式
3.只能讀
復制代碼 代碼如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>獲取計算后的樣式</title>
<style type="text/css">
#div1{ height:100px; background:#069;}
</style>
<script type="text/javascript">
//兼容
function getStyle(obj, name)
{
if(obj.currentStyle)
{
return obj.currentStyle[name];
}
else
{
return getComputedStyle(obj, false)[name];
}
}
window.onload=function()
{
var oDiv=document.getElementById('div1');
alert(getStyle(oDiv, 'width'));
alert(getStyle(oDiv, 'backgroundColor')); //注意在獲取復合樣式時要單獨寫，不能寫background
};
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
相關文章
怎么讓<textarea></textarea>之間包含的文本原封不動的顯示出來呢？下面小編就為大家介紹一下具體的實現(xiàn)方法吧2013-11-11
這篇文章主要介紹了在HTTPS 項目中使用百度地圖 API，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-04-04
這篇文章主要介紹了JS+canvas繪制的動態(tài)機械表動畫效果,涉及javascript結合HTML5 canvas簡單數(shù)值計算與動態(tài)繪圖相關操作技巧,需要的朋友可以參考下2017-09-09
JavaScript想實現(xiàn)繼承的目的：重復利用另外一個對象的屬性和方法。本文為大家總結了JavaScript實現(xiàn)繼承的6種常用方式，需要的可以參考一下2022-07-07
HTML中事件觸發(fā)列表與解說...2007-07-07
這篇文章主要給大家介紹了關于js控制滾動條滾動的兩種簡單方法,通過JavaScript可以直接控制滾動條的位置,從而達到鎖定滾動條的效果,文中通過示例代碼介紹的非常詳細,需要的朋友可以參考下2023-07-07
這篇文章主要介紹了異步加載JS、CSS代碼的相關資料,非常不錯具有參考借鑒價值，需要的朋友可以參考下2016-06-06
這篇文章主要為大家介紹了Electron 電源狀態(tài)管理示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-03-03
這篇文章主要介紹了微信小程序開發(fā)之路由切換頁面重定向問題，又通過實例代碼給大家介紹了微信小程序的路由跳轉方法,需要的朋友可以參考下2018-09-09
JavaScript實現(xiàn)跑馬燈抽獎活動實例代碼解析與優(yōu)化（一）
這篇文章主要介紹了JavaScript實現(xiàn)跑馬燈抽獎活動實例代碼解析與優(yōu)化（一）的相關資料,需要的朋友可以參考下2016-02-02