如何将两个字符串的cssText合并为一个？

我有以下两个cssText字符串：如何将两个字符串的cssText合并为一个？

var s1 = "text-align: right; font-weight: bold;"; 
var s2 = "text-align: left; color: #000";

我需要得到的字符串，从他们由合并后的属性：

var result = merge(s1, s2);

结果：

"text-align: left; font-weight: bold; color: #000;"

来源

2014-02-15 Erik

所以其合并并取代了。 “文本对齐”正在被覆盖。不是吗？ – anurupr

是的。文本对齐应该被覆盖最后一个 – Erik

您可以创建一个将关联数组（或映射）从字符串中移出并合并。这会给你合并的属性列表。否则，如果您只是想将所有这些属性应用于元素，即使您有两个相同的属性值，第二个属性也会优先。

来源

2014-02-15 07:54:33

你的意思是我可能只是应用那里的字符串元素？如下所示：el.style.cssText = s1 + s1？ – Erik

是的。你可以尝试这样的：

。这将适用于div的文本对齐。 –

谢谢。这是非常高性能的解决方案。 – Erik

这里是一个解决方案，将字符串数组并覆盖任何属性，如果它是有以前：

function merge(strings){ 
    var result = {} 
    for(var i in strings){ 
     var cssProperties = createObject(strings[i]) 
     for(var attr in cssProperties) { 
      result[attr] = cssProperties[attr]; 
     } 
    } 
    var s = '' 
    for(var attr in result){ 
     s += attr + ':' + ' ' + result[attr] + '; '; 
    } 
    return s.trim() 
} 

function createObject(s1){ 
    var obj = {}; 
    var properties = s1.split(';'); 
    for(var i=0; i<properties.length; i++){ 
     var property = properties[i].split(':'); 
     if(property.length == 2){ 
      console.log(property[1]); 
      obj[property[0].trim()] = property[1].trim(); 
     } 
    } 
    return obj; 
} 

merge(["text-align: right; font-weight: bold;", "text-align: left; color: #000"])

该解决方案将不只是两个字符串的任意号码，工作。

来源

2014-02-15 07:57:04

谢谢你的回答。 – Erik

编写一个函数，使一个对象脱离字符串，给你例如obj.fontWeight，它会说“粗体”。
使用上述函数从每个字符串中创建一个对象。
使用Object.create创建一个新对象，该对象将第一个对象作为原始参数，将第二个对象作为属性映射。这给了一个对象，其中第二个对象中的任何属性都会覆盖第一个对象中的属性，但其中的属性不是第二个对象中的属性，因此实现算法的合并部分。
编写一个函数，将您在3中创建的对象的所有属性都转换为字符串，记住您需要原型的属性以及不要在for循环中使用hasOwnProperty。

你需要处理从 - 形式到骆驼的情况，这是痛苦的，但很容易做到。

来源

2014-02-15 08:07:44 Woody

如上所述，

element.style.CSStext = s1+s2

是最适合直接使用CSS ......然而，

result = eval ("({"+ (s1+s2) . replace(/ *([^:;]+) */g,"'$1'") . replace(/;/g,",")+ "})" ) /* make object literally */ 
         . toSource()        /* lucky if using FF browser */ 
          . replace(/'|"|\({|}\)/g,"") 
            . replace(/,/g,";")   /* massage result */

来源

2015-08-04 01:47:11 ekim

如何将两个字符串的cssText合并为一个？

回答

相关问题