将linear-gradient分割为一个对象

Question

我希望将linear-gradient的值拆分成一个有键和值的object。

我的现有内容如下：

linear-gradient(10deg,#111,rgba(111,111,11,0.4),rgba(255,255,25,0.1))

我希望你能将它翻译成这样：

linear-gradient: {
  angle: '10deg',
  color1: '#111',
  color2: 'rgba(111,11,11,0.4)',
  color3: 'rgba(255,255,25,0.1)',
}

修改后的内容：我尝试运行我的代码，但没有成功：

var str = 'linear-gradient(10deg,#111,rgba(111,111,11,0.4),rgba(255,255,25,0.1))';
str = str.match("gradient\((.*)\)");
str = str[1].split(',');
console.log( str );

- Behzad

---

你尝试过提取括号内的字符串并按逗号分割吗？ - Tushar

是的，但是当它到达第一个rgba值时就会出错。我尝试过像这样：str.split(',')。 - Behzad

请添加您尝试过的代码。 - Tushar

var str = 'linear-gradient(10deg,#111,rgba(111,111,11,0.4),rgba(255,255,25,0.1))'; console.log( str, str.split(',') ); - Behzad

点击[编辑]链接并将代码添加到问题本身。如何格式化我的代码块？会帮助你。 - Tushar

我编辑并添加了我的代码，在达到对象后，我可以创建循环并获取所有键值作为对象。 - Behzad

Answer 1

使用 正则表达式，我们可以定义从字符串中获取哪些部分。

// Define string
var str = 'linear-gradient(to left top, #F0F calc(30% - 6px), hsl(100, 100%, 25%) 75%, yellow)';

// Get string between first ( and last )
str = str.substring(str.indexOf('(') + 1, str.lastIndexOf(')'));

// Finally with regex we can get each parts separatelly
console.log( str.split( /,(?![^(]*\))(?![^"']*["'](?:[^"']*["'][^"']*["'])*[^"']*$)/ ) );

输出结果将是:

(4) [Array]
  "to left top"
  "#F0F calc(30% - 6px)"
  "hsl(100, 100%, 25%) 75%"
  "yellow"

- Behzad

---

:-) 第一部分可以是角度或<边缘或角落>。颜色停止点也有一个<长度>，甚至可以通过<calcFunc>设置。颜色可以用任何CSS <color>值（红色，hsla(...)，...）来定义。话虽如此，您的正则表达式在"linear-gradient(to left top, #F0F calc(30% - 6px), hsl(100, 100%, 25%) 75%, yellow)"中失败了。 - Kaiido

@Kaiido的回答已经编辑过了 ;) - Behzad

你好，你能帮我看一下Swift版本吗？谢谢。 - famfamfam