I need to target the middle link specifically, I want to only alter the middle link.
Here's four ideas:
.sermons-links > :nth-child(2)
.sermons-links > a:nth-of-type(2)
.sermons-links > a[href=""]
.sermons-links > a[href="http://www.wpbuilder.co.za/wp-content/uploads/2020/01/8-Des-2019-preek.mp3"] + a
Related
I am trying to scrape products (not something surprising) - but honestly, defining the CSS selector for the product descriptions that works on any product page gives me a headache.
I look for the selector that defines the product description from the following link:
https://www.onlinebaufuchs.de/Werkzeug-Technik/Elektrowerkzeuge/Akku-Geraete/Akku-Schlagschrauber/Guede-Akku-Schlagschrauber-BSS-18-1-4-Zoll-0-Akkuschrauber-ohne-Akku-Ladegeraet::7886.html
The selector is:
#inner > div > div.col-lg-12-full.col-md-12-full > div:nth-child(1) > div:nth-child(12)
Alternatively, the selector can be:
div.pd_description:nth-of-type(6)
But sometimes the selector changes:
https://www.onlinebaufuchs.de/Werkzeug-Technik/Elektrowerkzeuge/Akku-Geraete/18-Volt-Lithium-Ionen-Akkusystem/Guede-Ladegeraet-LG-18-05-0-5-A-Aufladegeraet-fuer-diverse-Guede-Akku-Werkzeuge::7852.html
Here is the selector:
#inner > div > div.col-lg-12-full.col-md-12-full > div:nth-child(1) > div:nth-child(11)
Alternatively, the selector can be:
div.pd_description:nth-of-type(5)
When I look at the source code, the section of product description is defined with
.pd_description
But it's too general and used often in the source code for other sections too.
I can't figure out how to solute this problem.
My spider runs correctly, but from product to product i get empty descriptions (cause of my described issue).
def parse_product(self, response):
for product in response.css("body"):
yield {
"brand": product.css('div.pd_inforow:nth-of-type(4) span::text').extract(),
"item_name": product.css("h1::text').extract(),
"description": product.css('#inner > div > div.col-lg-12-full.col-md-12-full > div:nth-child(1) > div:nth-child(12)').extract_first
Why don't I match the product description with a CSS selector on all pages?
Using XPath selector (get div with class equal to pd_description that contains h4 with text Produktbeschreibung):
product.xpath('.//div[#class="pd_description"][h4[.="Produktbeschreibung"]]').get()
I'm using webdriver and CSS to find elements:
driver.findElements(By.cssSelector(css))
I was using a selector like this:
String css = "#mount_0_0_3c > div"
But I need to change it all the time:
"#mount_8_3_3u > div"
"#mount_0_5_5s > div"
"#mount_2_4_7g > div"
Is there any way to find elements using a pattern like "#mount* > div"?
Thanks!
I'm using the Symfony DOM crawler to scrape some websites and one of the issues I'm having is that if I have a scrape target which contains multiple tags, such as:
$content['html'] = $crawler->filter('
#content > div.container > div.row > div > p:nth-child(n+4),
#content > div.container > div.row > div > h3,
#content > div.container > div.row > div > blockquote')->each(function($node) {
$data = strip_tags($node->html(), '<div>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <p>, <a>, <strong>, <em>, <img>');
return $data;
});
I'm not getting the [p], [h3] or [blockquote] tags in my results (which is correct). However, depending on which tag I've just scraped, I would like to process the result a bit further rather than just returning it.
Is there any way the crawler can be queried to return the tag which the current item was matched against? Basically, I'd like to know whether the current item/tag I've matched was a [p], [h3] or [blockquote] which in turn will enable me to further process the results.
Figured it out ... there is a method
$node->nodeName();
which returns the tag the query was matched against ...
Hello all you smart CSS people... I've got a Doozey!
https://tritonmedicine.com/services is the page in question
It's the title down the page a bit, next to the picture
How do I style ONLY the ::before pseudo-class/id for the "preventative care" title? I'm trying to add the word "ADULT" in front of it, but if I use the id#1506, it won't work. If I only use the class (.tab-pane.active), it puts "ADULT" in front of every active title. What am I doing wrong here?
This DOESN'T work:
#1506.tab-pane.active > div:nth-child(2) > div > h3::before {
content: 'ADULT';
}
This DOES work (but styles them all, which I don't want):
.tab-pane.active > div:nth-child(2) > div > h3::before {
content: 'ADULT';
}
Any assistance is much appreciated :)
You can't select id that start with number in CSS selectors
For more CSS-Tricks
Solution
try somthing like these tab1506 or tabPane1506 or tp1506
But there is another solution of your problem, you can use
Attribute selector:
[id="1506"].tab-pane.active > div:nth-child(2) > div > h3::before {
content: 'ADULT';
}
For more read here
I want to do the following:
.feed > :not(:nth-child(n+5):nth-child(-n+10))
But apparently that's not available in css. Is there any way around this?
You can use
.feed > :not(:nth-child(n+5)), .feed > :not(:nth-child(-n+10)) {
background: red;
}
Demo
Explanation
That's because :nth-child(n+5):nth-child(-n+10) means :nth-child(n+5) AND nth-child(-n+10).
But according to de Morgan's laws,
not(A AND B) = not(A) OR not(B)
Then, if you want to negate it, instead of :not(:nth-child(n+5):nth-child(-n+10)), you need the OR operator ,:
:not(:nth-child(n+5)), :not(:nth-child(-n+10))
It seems like you're trying to select all elements that aren't the 5th - 10th child of .feed. Another way to do that would be to select the 1st-4th child elements, and then the 11th+ child elements.
This will do it:
.feed > :nth-child(-n+4), .feed > :nth-child(n+11) {
...
}
http://jsfiddle.net/9ZSeZ/1/