How to get background image from internal css using xpath?

Question

I want to get background-image URL that is in internal css. I'm using xpath in php

Here is the html structure

<div id="plugin-title" class="with-banner">
<div class="vignette"></div>

<style type="text/css">
#plugin-title { width:772px; height:250px; background-size:772px 250px; background-image: url(//ps.w.org/jetpack/assets/banner-772x250.png?rev=1279667); }
</style>
<h2 itemprop="name">Jetpack by WordPress.com</h2>
</div>

Hi. You can't do it directly with php. But, if you always analyze the same kind of data you can use any REGEX to extract the url of the image. Or you can looking for a powerfull library on the web that will analyze the code & css (if this library exists). Regex = The simplest way is : preg_match('/background-image: url$(.[^$]*)\)/sUi', $content) — Georges O.
– Georges O., Commented Oct 29, 2016 at 14:13

James Craig · Accepted Answer · 2016-10-29 14:19:50Z

1

If you want the links for background-image, then you can use this RegExp.

background-image.*?url\((.*?)\)

Example implementation:

$html = <<<EOT
<div id="plugin-title" class="with-banner">
    <div class="vignette"></div>
    <style type="text/css">
    #plugin-title { width:772px; height:250px; background-size:772px 250px; background-image: url(//ps.w.org/jetpack/assets/banner-772x250.png?rev=1279667); }
    </style>
    <h2 itemprop="name">Jetpack by WordPress.com</h2>
</div>
EOT;

preg_match_all('/background-image.*?url\((.*?)\)/mi', $html, $matches);

$matches contains all the background-image urls.

answered Oct 29, 2016 at 14:19

James Craig

6,90210 gold badges50 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to get background image from internal css using xpath?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related