JavaScript Command document.getElementsByClassName not working on special page-CodePudding

I am currently writing a bot to fetch data from a web live ticker. Therefore i created an app, that displays the webbrowser using Python QWebEngineView. Now if i want to get a special Value from the html code of the site i am currenty using:

self.browser.page().runJavaScript(
            "document.getElementsByClassName('team-score')",
            self.__update_points
        )

(browser is the QEngineWebView). The HTML of the site looks as following: (only the interesting snippet)

<div _ngcontent-jnr-c126="" >
        <div _ngcontent-jnr-c126="" >2</div>
        :
        <div _ngcontent-jnr-c126="" >2</div>
</div>

My goal is to extract the two point values ( ), but when i run the JS command it only throws out {} where should be those two objects.

CodePudding user response：

document.getElementsByClassName returns an HTMLCollection Object. It's iterable so it can easily be converted to an array with the spread operator.

As mentioned in my comment, try [...document.getElementsByClassName('team-score')].map(el => el.innerText).

The reason why it just returns an empty object is that the JSON.stringify() return value of HTMLCollection is just {} and you can't pass references in several situations while using tools like QWebEngineView. The object in the this will be passed to JSON.stringify() and sent to the extension/worker or whatever, therefor you might end with an useless result.

Converting it to an Array with [...HTMLCollection] and mapping it afterwards with the innerText of the value will result in [2,2].

Another solution would be: document.querySelector(".set-scores").textContent (or innerText) which may result in a string like "2:2".