How to change this XPath to CSS selector?
//div[following-sibling::div[contains(#class, 'active-member')]]
Does any XPath can be converted to CSS selector?
Not every XPath can be converted to CSS selector.
CSS selectors do not support matching elements according to their texts and not supporting traversing up to parent elements
As about converting this specific XPath to CSS selector I think it will be
div+div.active-member
However I'm not fully sure about this
Related
I have a special case where a script tag is placed outside the html tag :
<html>
....
</html>
<script>data</script>
both css and xpath selectors are not finding this script tag, the only way I found is using response.text , but that responds with a giant string and I can not make regex operations on it with selector re() function.
Is there a way to CSS or Xpath tags outside html tag?
I tried with
response.css('script')
But only consider script tags inside html tag
Thanks
Correction :
css selector does not consider tags outside HTML , xpath does.
I used some conditions to filter the tag :
response.xpath('//script[contains(., "function SelectItem()")]')
I'm working in a front end for the GSA, but I can't see how to style it.
Can anyone tell me if it is possible to use classes or the styling should be done inline on html tags?
You can either inline the CSS in the XSLT or host it on another webserver and reference it from within the XSLT as you would a normal HTML document.
Assuming you're outputting HTML from your XSLT then once you sort out where to put the CSS you just style it like any other HTML document.
Assuming I have the following HTML code:
...
<p>bla bla</p>
<h3>Foobar</h3>
<p>bla bla</p>
<p>bla bla</p>
<h3>Example</h3>
...
Is there a way to fetch the first h3 element which contains the text Foobar?
Since this is HTML, I would recommend CSS selectors:
puts doc.at_css('h3:contains("Foobar")')
#=> <h3>Foobar</h3>
CSS selectors tend to make for more readable expressions when parsing HTML. I tend to use XPath only for XML or when I need the full power of XPath expressions.
You can use the contains() XPath function:
doc.xpath("//h3[contains(text(), 'Foobar')]")
Or if the target text could be in a descendent text node of h3, use:
doc.xpath("//h3[contains(.//text(), 'Foobar')]")
To fetch the first matching element directly rather than an array, use at_xpath rather than xpath.
I have an xpath expression that looks like this:
find(:xpath, "//div[#id='drawer-1' and #class='drawer']/h2/a[#class='drawer-toggle']")
I was wondering, is it possible to somehow mix this with css to read something like this?
find("div#drawer-1.drawer/h2/a.drawer-toggle")
Or if this is not possible, is there another way to navigate a DOM with css?
Cheers!
You cannot mix xpath with css. However, in your example, the xpath can be translated to css.
You should be able to do:
find("div#drawer-1.drawer > h2 > a.drawer-toggle")
Note that the "/" are changed to ">". Xpath uses "/" as child selector, where as css uses ">".
A couple useful links:
Child selectors
A cheat sheet that compares xpath with css locators
//td[#class='Bu']/following::td[#class='Bu']
or
//td[#class='Bu'][2]
both are the same result when using XPath, so how can I change/convert them to CSS?
You can only do this with a CSS selector if the second td.Bu is a following sibling (means they share the same parent), or their parents are siblings and there are only two of them:
td.Bu ~ td.Bu
If they're completely unrelated, then it's not possible with CSS.