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