StyleSheet

动态修改外部或内联样式表
KISSY.use('stylesheet',function(S,StyleSheet){
    // use stylesheet
    /*
      <link id='existing'>
        a {
            color:red;
        }
      </link>
    */
    var stylesheet = new StyleSheet({
        el: '#existing'
    });

    stylesheet.get('a'); // => color:red
});

Class

Configs

Properties

Class Detail

class StyleSheet
SWF (config)
Parameters:config (Object) – 实例化 StyleSheet 对象的配置项, 详细见下节.

Configs Detail

StyleSheet.config.el

{HTMLElement|String} - link 节点或选择器

Properties Detail

StyleSheet.prototype.el

{HTMLElement} - link 元素节点

Methods Detail

StyleSheet.prototype.disable()
disable( )
禁用当前 stylesheet 所在样式表的所有样式
Returns:当前实例
StyleSheet.prototype.enable()
enable( )
启用当前 stylesheet 所在样式表的所有样式
Returns:当前实例
StyleSheet.prototype.isEnabled()
isEnabled( )
当前样式表是否已经被启用
Returns:{Boolean}
StyleSheet.prototype.get()
get( selectorText )
获取对应 selectorText 的样式定义文本.
Returns:{String}

例如:

KISSY.use('stylesheet',function(S,StyleSheet){
    // use stylesheet
    /*
      <link id='existing'>
        a {
            color:red;
        }
      </link>
    */
    var stylesheet = new StyleSheet({
        el: '#existing'
    });

    stylesheet.get('a'); // => color:red
});
StyleSheet.prototype.set()
set( selectorText, css )
设置对应 selectorText 的样式定义.
Params {String} selectorText:
 选择器字符串
Params {Object} css:
 样式键值对
Returns:当前实例

例如:

KISSY.use('stylesheet',function(S,StyleSheet){
    // use stylesheet
    /*
      <link id='existing'>
        a {
            color:red;
        }
      </link>
    */
    var stylesheet = new StyleSheet({
        el: '#existing'
    });

    stylesheet.set('a',{
        color:'',
        fontSize:'18px'
    }).get('a'); // => font-size:18px;
});