Я не разбираюсь в RegExp

[Solovei95]

Я хочу сделать перевод CSS свойств в массив и обратно.
Пример: <div id="block" style="background-image:url(),linear-gradient()"></div>
Я знаю как получить свойства CSS, но не знаю как разбить их на массивы?

[Solovei95]

Неужели прошло 100 лет, а люди так и не научились при помощи JS мастерски приручать CSS. :o

[Aetae]

>Я не разбираюсь в RegExp
Это печально.

И таки да, непонятно, что за массивы то нужны?

[Триви]

А зачем тут регэксп?

<div id="block" style="width:300px; display: block"></div>

 <script>
 var st = document.getElementById('block').getAttribute('STYLE');
  
 var arr = st.split(';'); // в массив
 alert(arr);
  
 var str = arr.join(';');  // обратно
 alert(str);
 </script>

[melky]

писать css-свойства через запятую ?

не маразмируйте. разделяйте правила через ;


Триви,

var st = document.getElementById('block').getAttribute('STYLE');

equals to

<div id="block" style="width:300px; display: block"></div>
<script>alert(document.getElementById('block').*!*style.cssText*/!*)</script>

[Solovei95]

melky,
Да вы ВСЕ не так поняли!
Как разбить на массив CSS свойство?
Речь идет о Multiple background

[Триви]

var st = document.getElementById('block').getAttribute('STYLE');

Ага, вылетело из головы это свойство

[melky]

ааа..

я сделал это через match
написал такую регу

 /[\w\-]+\([^\)]+\)/g

соответствует или буквам, или дефису(минусу), которых много, и после которых идёт открывающая круглая скобка, в которой находится всё, кроме закрывающей круглой скобки. после этого находится закрывающая круглая скобка.

пример :

// разобрали.
reg = /[\w\-]+\([^\)]+\)/g;

a=document.createElement('div');a.style.cssText='background:url("images/bar.png"), -webkit-linear-gradient(left,red,orange,blue)';

alert(a.style.background); // добавились запятые между цветами в градиенте !!

*!*
var array = a.style.background.match(reg); // это почти массив.
*/!*


alert( *!*[].slice.call(array)*/!*/*а теперь это массив*/.join('\n---------\n') )

ЗЫ долго отвечал) надо было реги повторить. забываются быстро


UPd но есть и минусы

рега не хавает такое

-moz-linear-gradient(bottom, rgb(247,232,44) 49%, rgb(255,255,71) 75%, rgb(255,255,100) 88%)

так что вам придётся убирать цвета в виде rgb(247,232,44) и преобразовывать их в hex.

[Aetae]

На вскидку, если упростить, как-то так:

/.+?(?=, url|, -moz-linear-gradient|$)/g

<div id="block" style="background:url(clock.png),-moz-linear-gradient(bottom, rgb(247,232,44) 49%, rgb(255,255,71) 75%, rgb(255,255,100) 88%)"></div>
<script>
alert(document.getElementById("block").style.background.match(/.+?(?=, url|, -moz-linear-gradient|$)/g).join('\n'))
</script>

так что вам придётся убирать цвета в виде rgb(247,232,44) и преобразовывать их в hex.

Хы, хы, браузеру на твои желания пофиг.

<div id="block" style="background:url(clock.png),-moz-linear-gradient(bottom, #F7E82C 49%, #FFFF47 75%, #FFFF64 88%)"></div>
<script>
alert(document.getElementById("block").style.background)
</script>

[Solovei95]

Блин! Я говорю нужна библиотека!