Accordion HTML Scrape How To?

How can I scrape this page properly that contains the data in a accordion? How can I scrape an html accordion when it will only show one active panel at a time? With your tool you cannot properly select multiple instances when the data is inside an accordion.

Url: Transition Bikes - It's Time To GiddyUp

Sitemap:

@ericlng Hello.

From the description you provided i would assume that you are trying to scrape the "upcoming events".

An element selector - div#accordion > h3 with "multiple" option checked, set as a "parent'' for two additional text selectors - span.HeadlineBlackSmallest & span.RegText should do the job.

Sitemap example:

{"_id":"transitionbikes-com","startUrl":["https://www.transitionbikes.com/EventsMap.cfm"],"selectors":[{"id":"product-wrapper","parentSelectors":["_root"],"type":"SelectorElement","selector":"div#accordion > h3","multiple":true,"delay":0},{"id":"title","parentSelectors":["product-wrapper"],"type":"SelectorText","selector":"span.HeadlineBlackSmallest","multiple":false,"delay":0,"regex":""},{"id":"date","parentSelectors":["product-wrapper"],"type":"SelectorText","selector":"span.RegText","multiple":false,"delay":0,"regex":""}]}

Helpful resources:

https://webscraper.io/how-to-video/multiple-items
https://webscraper.io/documentation/selectors/element-selector

Hope it helps.

Hey thanks @ViestursWS this helps, yes I was trying to grab all the details inside each event tab....Title, Date, Description. However I cannot grab the description text inside the active panel. Any idea how to grab the descriptions as well?

@ericlng Hey. For the description extraction, you can use - + div > span.RegText

@ViestursWS Awesome thanks so much for that, it worked. I'm trying to understand how you decided on that div? You've definitely helped me a lot so far with this one, but would you mind showing or describing how you knew to select that div for the description text?

I just pasted your text into the selector....but every time I tried to select that description text the regular way it keeps telling me the "Parent does not contain selected element". I'm inside the product-wrapper, but it grays out the description text and won't let me select it as a parent or child.
thanks for your time

@ericlng You should set the aforementioned selector as a "child" to the "product-wrapper" selector. Sometimes you can manually adjust the selectors if you inspect the code. Right click on of the description paragraph and choose - "Inspect".

Hope it helps.