Alex Dnepr Alex Dnepr - 2 months ago 10
React JSX Question

Getting value from a span tag on a web page which built by reactjs

I am very new to web design and development so some things might be wrong in my request. Basically, I have a web page with a bunch of span tags like this
ex:

example of span tag

Those span tags are the part of relatively big DOM tree and have a lot of ancestors.

As I understand, web page built by reactjs. Now my question is how in an efficient way, using JavaScript only I can get those values?

If you need additional info, please, do not hesitate to ask

Answer

First select all <span> elements which have the attribute data-reactid. Then you can get the reactid using .getAttribute("data-reactid") and the value by grabbing the spans childNode:

Example code

var elements = document.querySelectorAll("span[data-reactid]");
elements.forEach(function(entry) {
    console.log(entry.getAttribute("data-reactid")+ ": " + entry.childNodes[0].nodeValue);
});