Methods
css
String css ( selector, name )
获取符合选择器的第一个元素的样式值。
void css ( selector, name, value )
给符合选择器的所有元素设置样式值。
width
Number width ( selector )
获取符合选择器的第一个元素的宽度值。
该方法始终返回像素值。看例子:
<div style="width: 100px;">
<div id="test" style="width: 80%; height: 20px"></div>
</div>
<script>
var S = KISSY, DOM = S.DOM,
elem = S.get('#test');
DOM.css(elem, 'width'); // 返回 80%
DOM.css(elem, 'height'); // 返回 20px
DOM.width(elem); // 返回 80
DOM.height(elem); // 返回 20
</script>
void width ( selector, value )
给符合选择器的所有元素设置宽度值。等价为 DOM.css(selector, 'width', value)
height
Number height ( selector )
获取符合选择器的第一个元素的高度值。
void height ( selector, value )
给符合选择器的所有元素设置高度值。
addStyleSheet
void addStyleSheet ( cssText, id )
将 cssText 字符串作为样式添加到文档中。
show
void show ( selector )
显示符合选择器的所有元素。
hide
void hide ( selector )
隐藏符合选择器的所有元素。
toggle
void toggle ( selector )
将符合选择器的所有元素切换显示/隐藏两个状态。
Examples
测试页面:test-dom-style.html
dom-style 提供的所有方法:
- 参数 selector 可以为数组:
DOM.css([elem1, elem2], 'display', 'none');
- 参数 name 可以为 map 对象:
DOM.css('.widget', {position: 'absolute', top: '10px', left: '10px'});
- setter 和 getter 都遵循 get first, set all 原则:如果是获取,仅获取符合选择器的第一个元素的值;如果是设置,则操作符合选择器的所有元素。