Get background-image url using xpath - html

I'm trying to retrieve an url form background-image. So far i've managed to get the style however i can't seem to only get url.
What i managed so far:
//div[#class='opponent opponent1']/div[#class='team-player']/#style
Html example:
<div class="opponent opponent1">
<div class="team-player" style="background-image: url('/uploads/test.jpeg')"></div>
<h3>Team EnVyUs</h3>
</div>

The combination of substring-before and substring-after should do the trick:
substring-before(substring-after(//div[#class='opponent opponent1']/div[#class='team-player']/#style, "background-image: url('"), "')")

I think you are done with XPATH once you have selected the intended element. If you already got the style value you can use RegEX to get the url.
attribute.value.match(new RegEx("'(.*?)'"))[0];

Related

How to output background-image: url this image.jpg

I want this image how to get this image.jpg as output link. like XPath?
I tried for a few days but no luck is this possible?
<div class="vjs-poster" tabindex="-1" aria-disabled="false" style="background-image: url("https://image.jpg");"></div>
First of all, you need to get the HTML element that you want to extract the background image if (you can do it using document.getElementById or by using jQuery with xpath), then, you need to extract the style related to background image
element.style.backgroundImage
After that you can manipulate the string however you want, either by splitting by "url" or with regular expression.

Convert to CSS Selector

Trying to convert the below given HTML tag of a Image Button which I want to click but not getting clicked while using Xpath.
HTML Script
<img src="../../../../imagepool/transparent%21tmlservicedesk?cid=1"
id="reg_img_304316340" aralttxt="1" artxt="Show Application List"
arimgcenter="1" alt="Show Application List" title="Show Application List"
class="btnimg" style="top:0px; left:0px; width:23px; height:140px;">
Xpath Generated for the same:
//div[#class='btnimgdiv']/img[#id='reg_img_304316340']/#src
Read some of the articles that for image buttons CSS selector is much better than xpath and wanted to know how to convert the html to CSS selector.
Image BUtton which i want to click but not getting clicked while using Xpath
This is because you are using id attribute value of the element which looks like dynamically generated.
Read some of the articles that for image buttons CSS selector is much better than xpath
Yes, you are right, using cssSeector is much faster than xpath to locate an element.
wanted to know how to convert the html to CSS selector.
You need to use that attribute value which is unique and unchangeable to locate element, you can use below cssSelector :-
img.btnimg[title='Show Application List']
Reference Link :-
http://www.w3schools.com/cssref/css_selectors.asp
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors

How to use a link as image title in html

I made attempt and tried to find my goal But I couldn't and found solution like this that didn't benefit for me!
I have <img src="url" title="ali.com"> I want to make ali.com a link. I used
title=ALI.com but doesn't work! any way?
The title attribute accepts only plain text, you cannot have any markup there.
If you want a tooltip with a link inside (and I'd urge you not to as it is a difficult UI to use), then you'll need to build the whole thing with JavaScript and DOM.
Above answers suffices your requirement, but specific to your use case :
<img src="image url" title="ali.com"/>
You can use url as a title (google.com?d=1&e=2 this is string)
You need to run little js code to achieve final goal
put something like this html
<a class="mylink"> <img title="blahblah" scr =""></img></a>
and you can get title string by
yourtitlestring = $(".mylink img").attr("title")
and now you can set href of link
$(".mylink").setAttribute("href", yourtitlestring);

how to get text in a div without an id or class jsoup

i have the follow problem. I want to parse a html page with jsoup. The parsing is not the problem but i need to get the text in a div without using the id or class. there is a custom attribute in the div element.
<div id="test" custom="tester">Get this text </div>
i tried the follow thing:
Element bedrijfwrapper = document.select("custom[name="tester"].first();
but i dont't get it to work. Can someone help me out?
You should try this :
document.select('[custom="tester"]').first();
Good luck.
This might work:
doc.select("div[custom=tester]")

Selenium: Not able to understand xPath

I have some HTML like this:
<h4 class="box_header clearfix">
<span>
<a rel="dialog" href="http://www.google.com/?q=word">Search</a>
</span>
<small>
<span>
<a rel="dialog" href="http://www.google.com/?q=word">Search</a>
</span>
</h4>
I am trying to get the href here in Java using Selenium. I have tried the following:
selenium.getText("xpath=/descendant::h4[#class='box_header clearfix']/");
selenium.getAttribute("xpath=/descendant::h4[#class='box_header clearfix']/");
But none of these work. It keeps complaining that my xpath is invalid. Can someone tell me what mistake I am doing?
You should use getAttribute to get the href of the link. Your XPath needs a reference to the final node, plus the required attribute. The following should work:
selenium.getAttribute("xpath=/descendant::h4[#class='box_header clearfix']/a#href");
You could also modify your XPath so that it's a bit more flexible to change, or even use CSS to locate the element:
//modified xpath
selenium.getAttribute("//h4[contains(#class,'box_header')]/a#href");
//css locator
selenium.getAttribute("css=.box_header a#href");
I had similar problems with Selenium and xpath in the past and couldn't really resolve it (other than changing the expression). Just to be sure I suggest trying your xpath expressions with the XPath Checker addon for firefox.