Разделить линейный градиент на объект [дубликат]

На этот вопрос уже есть ответ здесь:

Я хочу разделить 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 );
1 5
javascript css linear-gradients

1 ответ:

С помощью Regular expression мы можем определить, какие части мы хотим от строки.

// 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"
1