我正在尝试迭代CSS样式。例如,我得到这样的风格:
document.styleSheets[0].cssRules[10].style
返回CSSStyleRule
,它是一个包含整数和字符串键的对象。
整数和.length
键可用于迭代样式中的属性赋值,每个键都给出属性的名称,例如:
document.styleSheets[0].cssRules[10].style[0] == "max-height"
字符串键可以访问样式的实际实际文本,如下所示:
document.styleSheets[0].cssRules[10].style["maxHeight"] == "100px"
因此理论上很容易迭代所有属性。但请注意从max-height
到maxHeight
的令人抓狂的变化!我怎么处理这个?我怎么知道这个映射是什么?我是否只需编写一个将-a
转换为A
的函数,依此类推?
答案 0 :(得分:0)
我最终使用此功能来改变案例:
function camelCaseCssName(str) {
var ret = "";
for (var i = 0; i < str.length; ++i) {
if (str[i] == '-') {
if (i < str.length - 1) {
ret += str[i+1].toUpperCase();
++i;
}
} else {
ret += str[i];
}
}
return ret;
}
Bhojendra发布的链接还包含我尚未测试过的版本,但它的版本要短得多:
styleProp = styleProp.replace(/\-(\w)/g, function(str, letter) {
return letter.toUpperCase();
});