一、使用js操作css屬性的寫(xiě)法

1、對(duì)于沒(méi)有中劃線的css屬性一般直接使用style.屬性名即可。

如：obj.style.margin，obj.style.width，obj.style.left，obj.style.position

2、對(duì)于含有中劃線的css屬性，將每個(gè)中劃線去掉并將每個(gè)中劃線后的第一個(gè)字符換成大寫(xiě)即可。

如：obj.style.marginTop，obj.style.borderLeftWidth，obj.style.zIndex，obj.style.fontFamily等

3、js操作css float屬性的特殊寫(xiě)法

因?yàn)?float 是javascript的保留字，我們不能直接使用obj.style.float來(lái)使用，這樣操作是無(wú)效的。其正確的使用方法是為：IE:obj.style.styleFloat，其他瀏覽器Mozilla(gecko)，ff等用 styleFloat:obj.style.cssFloat。

二、使用js獲取css屬性值

1、獲取行內(nèi)Style：obj.style. 屬性名。<div id="css88" class="ss" style="width:200px; height:200px; background:#333333">JS獲取CSS屬性值</div> 不能訪問(wèn)class。

2、獲取Class內(nèi)及Link外部的Css屬性：IE中使用的是obj.currentStyle[“屬性名”]方法，而FF是用的是getComputedStyle 方法

三、使用js給css屬性賦值

1、賦值class屬性

賦值：document.getElementById('ceil').className = "class1";

如它有多個(gè)值：document.getElementById('ceil').className = "class1 class2 class3";

2、obj.style.cssText設(shè)定一個(gè)對(duì)象的css樣式

document.getElementById('navition').style.cssText = "您的CSS代碼';

總結(jié)

知道如何動(dòng)態(tài)修改頁(yè)面上所應(yīng)用的樣式，對(duì)創(chuàng)建時(shí)髦而又富于交互的 Web 頁(yè)面來(lái)說(shuō)是極其有用的——本文中所闡述的知識(shí)構(gòu)成了諸如 JavaScript 動(dòng)畫(huà)之類(lèi)更高級(jí)的技術(shù)的基礎(chǔ)。需要注意的是，你應(yīng)當(dāng)負(fù)責(zé)任地使用動(dòng)態(tài)樣式修改，而且不要過(guò)度濫用。如前面所述，樣式修改還能提高Web效率——內(nèi)容的顯示和隱藏可以有助于避免在客戶(hù)端和服務(wù)器之間不必要的數(shù)據(jù)交互。

最新評(píng)論