Can someone help me with the below HTML:
<div id="ext-156" class="menuBar">
<a id="ext-234" href="javascript:void(0);" class="active">
<i id="ext-365" class="menuItem"></i>
</a>
</div>
I am looking for the element with class "menuItem" and only from inside the div with class "menuBar" in Selenium.
Well, depending on what language you're using, the method call will be different, but the selector should be the same across language bindings:
css:
"div.menuBar .menuItem"
xpath:
"//div[#class='menuBar']//*[#class='menuItem']"
In java, the call would look like this:
driver.find(By.cssSelector("div.menuBar .menuItem"));
You can use XPath: //div[#class='menuBar']//*[#class='menuItem'].
Related
I need to define an xpath before an element on the page. I have a string(FIO) that I can find using xpath and I need to bind to it. I don't understand how to do it.
My xpath witch i can find on page:
/html/body/div[1]/div[2]/section/div/div[1]/div/ul/li[2]//div[1]/span[contains(., '"+FIO+"')]
look at screenshot, i need find string 1, it have xpath:
/html/body/div[1]/div[2]/section/div/div[1]/div/ul/li[2]/ul/li[4]/ul/li[1]/div/div/a
image
string with my param(FIO) 2, have xpath:
/html/body/div[1]/div[2]/section/div/div[1]/div/ul/li[2]/ul/li[4]/ul/li[1]/div/div/div[1]/span
and i shortened it and inserted a variable:
/html/body/div[1]/div[2]/section/div/div[1]/div/ul/li[2]//div[1]/span[contains(., '"+FIO+"')]
how i can get xpath to element 2 with binding at element 1 ? maybe following sibling ?
sorry, i can't copy the code correctly, only like this:
</div>
</div>
<ul>
<li>
<div class="structure2__item1">
<div class="structure2__item2" style="">
<a class="structure2__position" href=https://**>
"String 2"
</a>
<div class="structure2__name" style="">
<span>String_FIO</span>
</div>
</div>
</div>
</li>
<li>
//div[child::span[contains(text(), "String_FIO")]]/preceding-sibling::a
This would help fetch the a tag from the span.
(From next time - please look out for the standards mentioned in the comments.)
I am using selenium with python. All of the HTML shares the same div class "links". There are seven links in total on the page, each with the same class and part of the same name. I was wondering how to click on the web element if they have the exact same name <div class"link">
Selenium with python using chrome webdriver.
<div class="aux">
<div class="links">
<a class="view" href="/pmc/articles/PMC1403861/">Summary</a>
<a class="view" href="/pmc/articles/PMC1403861/?report=classic&page=1">Page Browse</a>
<a class="view" href="/pmc/articles/PMC1403861/pdf/jeabehav00206-0003.pdf">PDF–1.6M</a>
<a class="view citationexporter" href="#" data-citationid="PMC1403861" role="button" aria-expanded="false" aria-haspopup="true">Citation</a>
</div>
</div>
Try using below syntax -
Python:
driver.find_element_by_xpath("//div[#class = 'links']/a[3]")).click();
Java:
driver.findElement(By.xpath("//div[#class = 'links']/a[3]")).click();
You can use the css selector like bellow:
.find_element_by_css_selector('div.links a[href*="pdf"]').click()
Or if you want to use a sequence:
.find_element_by_css_selector('div.links a:nth-child(3)').click()
Reference:
CSS Selector Reference
CSS :nth-child() Selector
You can use XPath with indexing of element.
e.g:
//div[#class='links']/a[3]
or
//div[#class='links']//following::a[3]
For more details refer below URL:
https://www.guru99.com/using-contains-sbiling-ancestor-to-find-element-in-selenium.html
To find the 3rd class with class name links.
elem=driver.find_elements_by_xpath("//div[#class='links']")[3]
elem=driver.find_element_by_css_selector("div.links:nth-child(3)")
I'm using an app that allow me to change only the CSS of a webpage.
The devs create a step_btn class for 2 distinct buttons (previous and next button) and i want to change the CSS of each button separately.
I tried to make the changes through the div id but nothing happened...
Here is the page code :
<div id="j_id0:j_id73" class="navbuttonsContainer">
<div id="j_id0:j_id74" style="height:35px;overflow:visible;position:relative;" class="rowElem">
<div id="j_id0:j_id78" class="btnWrapper">
<a class="step_btn" onclick="saveAndGoTo('next')" title="Next Page">
<span id="j_id0:nextBtn">Next Page</span>
</a>
</div>
<div id="j_id0:j_id81"></div>
</div>
</div>
Here are my tries :
#j_id0:j_id78
div#j_id0:j_id78 {}
div#j_id0:j_id78 .step_btn {}
Is it my tries that failed or the webpage doesn't interpret my code correctly ?
Thanks for your help !
use an attribute selector to enclose the id as a string, e.g.
[id="j_id0:j_id78"] .step_btn { ... }
In fact using the id selector — like for #j_id0:j_id78 — the parser would consider j_id0 as the id and :j_id78 as a pseudoselector
Note: no need to specify the div element in front of the attribute, since the id should be unique in the page.
I have some block of code and need to get data out of it and trying different version of xpath commands but with no success.
<div>
<div class="some_class">
<a title="id" href="some_href">
<nobr>1<br>
</a>
</div>
<div class="some_other_class">
<a title="name" href="some_href">
<nobr>John<br>
</a>
</div>
</div>
<div>
<div class="some_class">
<a title="id" href="some_href">
<nobr>2<br>
</a>
</div>
<div class="some_other_class">
<a title="name" href="some_href">
<nobr>John<br>
</a>
</div>
</div>
// and many blocks like this
So, this div blocks are the same except they are different by content of its sub-element. I need xpath query to get John's href which <a title="id"> is equal to 1.
I've tried something like this:
//div[./div/nobr='1' AND ./div/nobr='John']
to get only div that contains data I need and then wouldn't be hard to get John's href.
Also, I've managed to get John's href with:
//a[./nobr='John'][#title='name']/#href
but that way it doesn't depend on value from <a title="id"...> element but it has to depend on it.
Any suggestions?
I think what you want is
//div/div[a/#title='id']/following-sibling::div[1]/a/#href
which, given a well-formed input document, will return (individual results separated by --------):
href="some_href"
-----------------------
href="some_href"
You did not explain it very clearly though, as kjhughes has noted, and perhaps your sample HTML is not ideal.
Regarding your attempted path expressions, as the input is HTML, it is hard to know whether
<nobr>John<br>
means that "John" is inside the nobr element or not.
Thanks Mathias, your example was helpful, but as there are many elements with #title='id' it isn't reliable solution that will always catch good elements.
I've managed to make workaround, first catched the whole div, and then extract href I need.
//div[./div/a[#title='name']/nobr='John' and ./div/a[#title='id']/nobr='1']
//a[./nobr='John'][#title='name']/#href
My question is based on SO question Bootstrap tooltips not working
So, the solution is to use:
jQuery:
$("[rel='tooltip']").tooltip();
html:
test
And that works perfect.
My question is: what if I want to use a <span> tag instead of <a>.
Should it be <span rel="tooltip" title="A nice tooltip">Hover on me</span> ?
It works perfectly but I see the rel attribute is used for a tags.
So, what's the correct solution?
Your can write in the following ways :
Method 1
<a title="" data-placement="top" data-toggle="tooltip" href="#" data-original-title="Tooltip on top">Tooltip on top</a>
And Than initialize it with the following code :
$('a').tooltip();
The other way is to use classes or ids and initialize them one by one like :
Method 2
<span class="top" title="A nice tooltip" data-original-title="Tooltip on right">Hover on me</span>
<a class="top" title="" href="#" data-original-title="Tooltip on top">Tooltip on top</a>
Than initializing it with the following code :
$(".top").tooltip({
placement: "top"
});
Jsfiddle Method 1
Jsfiddle Method 2
If you don't want to use a rel attribute on a <span>, simply use something else like a class and update the tooltip selector, eg:
$("[rel='tooltip'], .tooltip").tooltip();
<span class="tooltip" title="A nice tooltip">Hover on me</span>
You can use any CSS selector inside the jQuery function $() to select any element on the page in any way.