DOM 5 動態修改樣式和層疊樣式表

表示所有css樣式表，包括外部link和嵌入style的;通過document.stylesheets屬性可以獲得文件中cssstylesheet物件的列表；其中每個cssstylesheet都具有以下屬性：

每個cssstylesheet物件內部包含著一組cssstylerule物件document.stylesheets[0].cssrule, 每個物件document.stylesheets[0].cssrule[0]有如下屬性:

這是用的最多的物件，表示乙個元素的style屬性（內嵌在元素中的值）a.$('a').style

注意通過此屬性只能訪問到在元素的style屬性中以嵌入方式宣告的css屬性，無法訪問層疊樣式表或從父類繼承的屬性

style引用的是htmlelement物件的style屬性,本身是cssstyledeclaration物件；一般使用第一種並相容第二種

classname引用的是htmlelement物件的class屬性，相容性考慮一般用第二種方法

常用屬性

* type * href * media * rel, 表示樣式表於文件之間的關係 * 設定'stylesheet' 指定乙個樣式表立即應用到文件 * 設定'alternate stylesheet' 將其作為備用樣式表；瀏覽器載入該樣式表時會將其disbaled設定為true； * disabled, 表示樣式表是否起作用

* title, 標題，也在指令碼中用到；

通過js操作disabled值改變樣式

先用設定公用樣式，然後分別設定body.a;body.b等及下面的元素樣式；最後通過改變body的classname來改變樣式

直接通過js刪減樣式表

dom2樣式規範在document.defaultview中包含了乙個getcomputedstyle()方法；返回乙個唯讀的cssstyledeclaration物件

var elemet = a.$('example');
var styles = document.defaultview.getcomputedstyle(element);
var color = styles.getproperty('background-color');

function fadecolor(from ,to ,callback , duration, framespersecond)  catch(e) 
}, (duration * 1000 / framespersecond) * frame );
}var duration = duration || 1;
var framespersecond = framespersecond || duration * 15;
var r, g ,b;
var frame = 1;
dotimeout('rgb(' + from.r + ',' + from.g + ',' + from.b + ')', 0);
while(frame < framespersecond + 1) 
}fadecolor(/*開始顏色*/, /*結束顏色*/, function(color) )
});

DOM 5 動態修改樣式和層疊樣式表

PyQt5 QSqlTableModel 修改事件

動態建立dom物件

Dom動態移動元素

DOM 5 動態修改樣式和層疊樣式表

PyQt5 QSqlTableModel 修改事件

動態建立dom物件

Dom動態移動元素

相關推薦