Xidel get json from HTML tag attribute

Question

I am trying to extract an image URL from a div, where the link to the file is stored as a json object in data-settings attribute:

<div class="c-offerBox_galleryItem">
    <div data-component="magnifier" data-component-on="@load" data-settings="{
                image: '/media/cache/gallery/rc/p2vgiqwd/images/42/42542/KRHE7Z29X19.jpg',
                ratio: 1.5,
                outside: 0
            }"></div>
</div>

Currently I can access data-settings with:

xidel "https://example.com" -e "//div[@class='c-offerBox_galleryItem']/div/@data-setting

The output is the json object. How can I access the image object?

I thought something like:

xidel "https://example.com" -e "//div[@class='c-offerBox_galleryItem']/div/@data-setting/$json/image

would work, but not.

Answer 1

No, you can only use the global default variable $json when "https://example.com" itself returns a JSON.
To parse a string as JSON use parse-json(). And in this case you'll need the option "liberal" as well.

xidel -s "https://example.com" -e "//div[@class='c-offerBox_galleryItem']/div/parse-json(@data-settings,{'liberal':true()})"

For Xidel 0.9.8 use json() (deprecated for newer builds).

xidel -s "https://example.com" -e "//div[@class='c-offerBox_galleryItem']/div/json(@data-settings)"