I am on the following site : Betway and want to extract via a query all the values from the selector collectionitem with the class oneLineEventItem.

I can partially get this with the following:

document.querySelectorAll("div[collectionitem] ~ .oneLineEventItem").forEach((result) => {
    console.log(result)
})

However I have noticed the following issues with this:

1. It selects n-1 such that the first is not selected.
2. It prints the node tree and not just the values.

How do I correctly select all and print the values out?

CodePudding user response：

Using the General sibling combinator (~) is not the good approach. To select all div elements having the attribute collectionitem and the class oneLineEventItem you should use the following selector :

div[collectionitem].oneLineEventItem

Then, as I said in my comment, you can get the value of the collectionitem attribute using the getAttribute() method :

document.querySelectorAll("div[collectionitem].oneLineEventItem").forEach((result) => {
    console.log(result.getAttribute("collectionitem"));
})

<div collectionitem="test1" >foo</div>
<div collectionitem="test2" >bar</div>