jquery - jquery - 将字符串转换为对象，url被剥离

Question

我正在将字符串转换为对象，但它正在剥离链接，请修复我的代码，使其无法剥离 url/链接。目前它正在剥离这个

url("http://localhost/xyz.jpg")到url("http

        var style = 'background-image:url("http://localhost/xyz.jpg");
                    font-size: 20px;font-weight: 300;padding: 20px 10px;';
        if (typeof style != 'undefined'){
            var att = style.slice(0,-1).split(';');
            var obj = {};
            for (var i = 0; i < att.length; i++) {
                var parts = att[i].split(':');
                obj[parts[0]] = parts[1].substring(1);
            }
            console.log( obj);
}

谢谢你的帮助。

Answer 1

您需要确保在 之后只获得两个块split()：

而不是这个：

var parts = att[i].split(':');

做这个：

var parts = att[i].split(':');
parts = [parts.shift(), parts.join(':')];

例子：

> parts = 'background-image:url("http://localhost/xyz.jpg");'.split(':')
["background-image", "url("http", "//localhost/xyz.jpg");"]
> parts = [parts.shift(), parts.join(':')]
["background-image", "url("http://localhost/xyz.jpg");"]

Answer 2

您可以更换

var parts = att[i].split(':');

符合

var parts = att[i].split(/:(?!\/)/);

仅在:s 之后没有 a 的处拆分/（使用负前瞻）。

Answer 3

尝试

var style = 'background-image:url("http://localhost/xyz.jpg"); font-size: 20px;font-weight: 300;padding: 20px 10px;';
if (typeof style != 'undefined'){
    var att = style.split(';');
    var obj = {};
    for (var i = 0; i < att.length; i++) {
        if(att[i]){
            var parts = att[i].match(/^\s?([a-z-]+):(.*)/);
            obj[parts[1].replace(/^\s+|\s+$/, '')] = parts[2].replace(/^\s+|\s+$/, '');
        }
    }
    console.log( JSON.stringify(obj));
}

演示：小提琴