Question

将css属性从字符串拆分或提取到对象中的最佳方法是什么？

var cssProperties = 'background:green;content:"Content;";color:pink;';

以上应该导致以下

var theObject = {
    background:'green',
    content:'"Content;"',
    color:'pink'
}

不幸的是，由于url中的分号，我不能只使用split（“;”）并遍历数组。我可以创建一个循环遍历每个角色的巨型循环，同时跳过“;”只有用引号括起来，但这似乎有点不对。

这是否有正则表达式技巧？

可选还有任何非常好的正则表达式网站。我理解大部分语法，但在我找到的大多数网站上似乎没有很多实际的复杂例子。

Answer 1

这是一个小提琴，进一步展示了这个功能：http://jsfiddle.net/ZcEUL/

(function() {
    var div = document.createElement('div'),
        rprops =/[\w-]+(?=:)/g,
        rcamelCase = /-(\D)/g,
        fcamelCase = function(a,letter) {
                return letter.toUpperCase();
            };
    window['styleToObject'] = function(str) {
        var props = str.match(rprops),
            prop, i = 0,
            theObject = {};
        div.style.cssText = str;
        while (prop = props[i++]) {
            var style=div.style[prop.replace(rcamelCase,fcamelCase)];
            if (style) {
                theObject[prop] = style;
            }
        }
        return theObject;
    };
})();

Answer 2

以下是我对您列出的第一个css字符串所做的解决方案......不是最好的，但也许它会激发一些想法。

JSFiddle Example

Answer 3

试试这个或类似的东西

var newString = cssProperties
                   .replace(":", ":'")
                   .replace(";", ", '");
var obj = eval(newString);

Javascript将属性拆分为Object排除在Strings中

3 个答案: