CSS DOM的小知識 二

上篇文章說到，通過element.style.property可以獲得元素的樣式，但是style屬性只能夠返回內嵌樣式，對於外部樣式表的樣式和head中的style樣式都無法獲取，這就限制了此方法的使用。

這幾天做了乙個實際的例子，感覺可以拿出來講講，填補一下這方面的知識的空白。最終的效果是這樣的：

html**如下：

web前端

後台指令碼
前端框架

1 *

2     .menu
3     .menu p
5     .menu div ul
6     .menu li

window.onload=function()

var links = $('menu').getelementsbytagname('p');
var uls =$('menu').getelementsbytagname('ul');
for(var i =0; i < links.length; i++)else}}

element.style只能獲取和設定元素style屬性中的css樣式，假如一開始元素無 style property，自然對應element.style裡面的屬性是空字串，所以第一次點選才會直接設定到element.style.display = 'none'，點選第二次切換到element.style.display = 'block'。這是需要點選兩次才能夠正常切換的原因。

這裡的話，有兩種方法可供參考：

1.直接在else的分支上設定block，這樣第一次點選就顯示。這種方法比較投機取巧。

2,直接獲取style中的display：none樣式，這時候就需要獲取計算後的樣式，可以用getcomputedstyle和ie上的ele.currentstyle。

getcomputedstyle是乙個可以獲取當前元素所有最終使用的css屬性值。返回的是乙個css樣式宣告物件([object cssstyledeclaration])，唯讀。而currentstyle是ie瀏覽器自娛自樂的乙個屬性，其與element.style可以說是近親，至少在使用形式上類似，element.currentstyle，差別在於element.currentstyle返回的是元素當前應用的最終css屬性值（包括外鏈css檔案，頁面中嵌入的屬性等），這兩種方法的使用還是能夠解決這樣的問題的。

上篇文章說到，通過element.style.property可以獲得元素的樣式，但是style屬性只能夠返回內嵌樣式，對於外部樣式表的樣式和head中的style樣式都無法獲取，這就限制了此方法的使用。

這幾天做了乙個實際的例子，感覺可以拿出來講講，填補一下這方面的知識的空白。最終的效果是這樣的：

html**如下：

web前端

後台指令碼
前端框架

1 *

2     .menu
3     .menu p
5     .menu div ul
6     .menu li

window.onload=function()

var links = $('menu').getelementsbytagname('p');
var uls =$('menu').getelementsbytagname('ul');
for(var i =0; i < links.length; i++)else}}

element.style只能獲取和設定元素style屬性中的css樣式，假如一開始元素無 style property，自然對應element.style裡面的屬性是空字串，所以第一次點選才會直接設定到element.style.display = 'none'，點選第二次切換到element.style.display = 'block'。這是需要點選兩次才能夠正常切換的原因。

這裡的話，有兩種方法可供參考：

1.直接在else的分支上設定block，這樣第一次點選就顯示。這種方法比較投機取巧。

2,直接獲取style中的display：none樣式，這時候就需要獲取計算後的樣式，可以用getcomputedstyle和ie上的ele.currentstyle。

getcomputedstyle是乙個可以獲取當前元素所有最終使用的css屬性值。返回的是乙個css樣式宣告物件([object cssstyledeclaration])，唯讀。而currentstyle是ie瀏覽器自娛自樂的乙個屬性，其與element.style可以說是近親，至少在使用形式上類似，element.currentstyle，差別在於element.currentstyle返回的是元素當前應用的最終css屬性值（包括外鏈css檔案，頁面中嵌入的屬性等），這兩種方法的使用還是能夠解決這樣的問題的。

CSS DOM的小知識 一

在dom程式設計藝術中，css dom應用很廣泛。1.style屬性 通過element.style.property可以獲得元素的樣式，但是style屬性只能夠返回內嵌樣式，對於外部樣式表的樣式和head中的style樣式都無法獲取，這就限制了此方法的使用。輸出 若更改樣式，則如下 輸出 但是實際...

《DOM程式設計藝術》中CSS DOM的總結（二）

前言 接上篇，本篇有兩個內容 乙個是demo 當滑鼠hover到 的一行上時這行 字型加粗。好了，廢話少說，開始！嚴肅的分割線 需求 建立乙個 當滑鼠hover到一行上時，改變這行中字型的樣式，滑鼠移走恢復原樣。這是乙個 when where 9月9日 北京路25號人民廣場 10月9日 南京路28號...

小知識二 Then協議

在手寫 的時候，常常會用到一些懶載入的方式來書寫控制項，下面是個then協議，不會產生迴圈引用的問題，看起來比較的緊湊，更加的直觀。public protocol then extension then where self anyobject let uilabel then 2.1 推薦 無引數...