What do these web driver selectors select?
get talktoSales(){return $("(//div)[56]")}
get popUpclick() {return $("//div[#class='spu-container']")}
Thank you.
Without the link to the webiste it would be difficult to point to the exact element selected by these selectors.
The first selector "(//div)[56]" selects the 56th div element in the page
The second one "//div[#class='spu-container']" selects the first div element that has the class name as 'spu-container'
Related
I want to select the first <d> in <a> and I do not know how many and what non-d elements are in <...>.
Is it possible to select the first <d> with CSS selectors?
<a>
<...>
<d></d>
</...>
<b>
<d></d>
</b>
</a>
Edit: I think this is impossible and would like to get confirmation about this.
It's not possible to match the first descendant of a certain kind within an ancestor if the location of the first descendant cannot be known in advance. jQuery provides the :eq() selector for this, for which there is no standard equivalent.
For example, if you know the first d is always the first child of some other element that's the first (or second or nth) child of a, you can select that, but if it's not always going to appear there, you have to account for all the other possible locations, which you may or may not be able to do depending on how the markup is generated.
Example:
I have this element:
<div id="foo" class="my-foo"></div>
If I click the "+" button in the chrome console
Chrome will "suggest" to select the div via it's id, and not via class, like this:
div#foo{}
Isn't kind of incorrect to style elements via their IDs?
When adding a style rule for an element with an ID, the inspector generally assumes you want to style only that element, and not any other div elements or elements that happen to match .my-foo, hence the suggestion of an ID selector.
It's not clear to me why it prepends a type selector to the ID, though. If it's trying to guard against duplicate IDs, it's certainly not going to prevent the selector from matching two divs with the same ID, which is far more likely than two elements of different types having the same ID.
I need to identify an object using CSS selector, but I am facing a problem
This is the web element I am trying to identify:
<span class="tag-bold">TRF100002</span>
How to translate this line into CSS selector?
this selector will select all span elements with class tag-bold
span.tag-bold
If you have more of these and you want to select only some you will have to give them IDs.
Java can handle only limited html subset in its components. I tested this selector only in JLabel and JTextPane (works in both).
Actually, I want to know the difference between:
#content{some CSS rules}
and
div#content{some CSS rules}
The first one selects any element with the ID content.
The second one selects any div element with the ID content.
MDN: Writing efficient CSS - How the style system matches rules
I'm applying :last-of-type to an element that should be as such. Check out the final div.info (that's the bottom information for each article) on http://www.elemovements.com. Why is it not working?
The :nth-of-type() family of pseudo-classes only look at an element's type, that is, its tag name. They do not filter by your class selector or any other selector.
Therefore, your statements:
I'm applying :last-of-type to an element that is clearly as such. Check out the final div.info
Are contradictory. There's a div.center after that, making that the last div, not your div.info.
You cannot currently use CSS selectors to find your last div.info; you'll have to resort to adding an extra class and/or using JavaScript.
You're having one of the most common misconceptions about CSS. CSS is not read left-to-right, but right to left!
Meaning, the browser will look for div.info:last-of-type, so browser will filter elements in the following order:
Last element of each type (tag name)
Has class of info
Is a div.
Your element does not satisfy these conditions in that order. It may be the last div with class of info, but no last element has a class of info
This 2 are the same:
div.info:last-of-type
div:last-of-type.info
The :last-of-type is hitting the div, not the .info, and the .info is limiting the found results to 0.
Another example:
.section.section-test:last-of-type
Would actually works like: .section:last-of-type.section-test