I have such an inline CSS like this
color:#777;font-size:16px;font-weight:bold;left:214px;position:relative;top:70px
The CSS may end with a semicolon ";" or not. It also can contain extra space between its values. I'm about using "explode" function to parse the CSS into an array, something like :
Array(
"color" => "#777",
"font-size" => "16px",
"font-weight" => "bold",
and so on.
Can anybody suggest me a way to use regular expression to complete this task?
Another way, using a regex:
$css = "color:#777;font-size:16px;font-weight:bold;left:214px;position:relative;top: 70px";
$results = array();
preg_match_all("/([\w-]+)\s*:\s*([^;]+)\s*;?/", $css, $matches, PREG_SET_ORDER);
foreach ($matches as $match) {
$results[$match[1]] = $match[2];
}
print_r($results);
Outputs:
Array
(
[color] => #777
[font-size] => 16px
[font-weight] => bold
[left] => 214px
[position] => relative
[top] => 70px
)
Here's a quick-and-dirty script that does what you're asking:
<?php
$css = "color:#777;font-size:16px;font-weight:bold;left:214px;position:relative;top: 70px";
$attrs = explode(";", $css);
foreach ($attrs as $attr) {
if (strlen(trim($attr)) > 0) {
$kv = explode(":", trim($attr));
$parsed[trim($kv[0])] = trim($kv[1]);
}
}
?>
And the output of print_r($parsed) is:
Array
(
[color] => #777
[font-size] => 16px
[font-weight] => bold
[left] => 214px
[position] => relative
[top] => 70px
)
background-image: url(/example.jpeg?arg=1;arg=2);. Regular expressions are not a good choice for parsing non-regular data.
explode's - Perhaps you should direct the RE hate somewhere else this time ;)
I had issues with the regex solution, and the quick and dirty php explode solution fails with urls, so here is another non-regex solution that doesn't fail with urls:
$css = 'background-image:url(https://test.com/media.jpg);color:#777;font-size:16px;font-weight:bold;left:214px;position:relative;top:70px';
$attrs = explode(';', $css);
$parsed = [];
foreach($attrs as $attr) {
$first_colon_pos = strpos($attr, ':');
$key = substr($attr, 0, $first_colon_pos);
$value = substr($attr, $first_colon_pos + 1);
$parsed[$key] = $value;
}
Outputs:
Array
(
[background-image] => url(https://test.com/media.jpg)
[color] => #777
[font-size] => 16px
[font-weight] => bold
[left] => 214px
[position] => relative
[top] => 70px
)
In case of someone who's looking for something without a loop there's this solution.
Use case: string from HTML style attribute (needed for Behat Tests for example)
$styleAttribute = "color: blue; opacity: 50%;";
$styleAsKeyValuePairs = array_column(array_chunk(preg_split("/[:;]\s*/", $styleAttribute), 2), 1, 0);
print_r($styleAsKeyValuePairs);
Hope this whould be helpful !
Let try this it will work fine
str.replace(/(\w+[-]?\w+)(?=:)/gi,'\n[$1] => ').replace(/[:;]+/g,'')
