指令碼化CSS

2022-01-11 07:09:04 字數 496 閱讀 7265

一、指令碼化內聯樣式

style是元素物件的屬性,它可以在js中操作。但是style屬性不同尋常:它的值不是字串,而是乙個cssstyledeclaration物件。

如果css中屬性名帶"-",在cssstyledeclaration屬性中應改成駝峰命名。

使用cssstyledeclaration物件的style屬性時,所有的值都是字串!!

所有的定位屬性都應該包含單位!!

e.style.left = 300 //錯誤:它是數字不是字串

e.style.left = "300" //錯誤:缺少單位

單個字串值設定內聯樣式

//兩者都可設定e的內聯樣式為s

e.setattribute("style",s);

e.style.csstext = s;

兩者都可以獲取e的內聯樣式

s = e.getattribute("style");

s = e.style.csstext;

css指令碼化

dom.style.prop 1 可讀寫行間樣式,沒有相容性問題,碰到float的保留字屬性,其前面應加css 不加也可以 2 復合屬性必須拆解,組合單詞變成小駝峰式 border 1px solid black 屬性拆解 borderwidth 1px borderstyle solid bord...

指令碼化CSS

讀寫元素css屬性 dom.style.prop 可讀寫行間樣式,沒有相容性問題,碰到float這樣的保留字屬性,前面加css 復合屬性必須拆解,組合單詞變成小駝峰式寫法 eg float cssfloat 寫入的值必須是字串格式 查詢計算樣式 window.getcomputedstyle ele...

獲取視窗屬性,獲取dom尺寸,指令碼化CSS 自用

document.body documentelement.scrolleftscrolltop 封裝相容性方法,求滾動輪滾動離getscrolloffset return x 滾動條滾動的x軸距離 return y 滾動條滾動的y軸距離 function getscrolloffset else ...