Document.styleSheets:一组关联于文档的样式表片段集合.
Document.styleSheet:一个关联于文档的样式表片段对象.
function getDocStyleSheets(){ var doc_styleSheets=document.styleSheets; return doc_styleSheets; } var css01=getDocStyleSheets()[0]; //得到文档中关联的第一个stylesheet片段对象.
stylesheet对象
1. 对于Firefox公开的对象:
type
disabled
ownerNode
parentStyleSheet
href
title
media
ownerRule
cssRules
insertRule
deleteRule
2. 对于IE公开的对象:
owningElement
pages
id
type
href
disabled
cssText
readOnly
title
parentStyleSheet
imports
rules
media
兼容IE&FireFox的对象:
disabled –> 是否启用此css定义片段
//eg. css01.disabled=true; //这时当前文档将忽略css01的css定义
rules–>css定义集合[IE专有],可读写
cssRules–>css定义规则集合[Firefox专有]可读写
//eg. var css01_Rules=css01.rules || css01.cssRules; css01_Rules.style.fontSize='12px';
这时候将改变css定义中
body{ font-size:14px; } function getDocStyleSheets(){ var doc_styleSheets=document.styleSheets; return doc_styleSheets; } var css01 = getDocStyleSheets()[0]; //得到文档中关联的第一个stylesheet片段对象.
这种应用可以应用在对于页面大量dom元素的渲染操作。非常节省客户端资源。免除了遍历DOM节点。免除了给每个dom节点设置特定的id或className