Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Get HTML tag name from React element?

Tags:

People also ask

How do I get a tag name in React?

When the button element is clicked, the click event gets triggered, the value of the tagName property can be used to find out HTML element the source of the event and innerText property can be used to find out text written in that HTML element.

How do you get the HTML element in React?

Access a DOM Element Using ReactDOM.findDOMNode() . findDOMNode() is used to find a specific node from the DOM tree and access its various properties, such as its inner HTML, child elements, type of element, etc.

How do you get an ID of an element in React?

To get the id of the element on click in React: Set the onClick prop on the element to a function. Access the id of the element on the currentTarget property of the event . For example, event.currentTarget.id returns the element's id .

Can I use getElementById in React?

getElementById() method in React is using refs. To select an element, set the ref prop on it to the return value of calling the useRef() hook and access the dom element using the current property on the ref , e.g. ref.


Is it possible to get an HTML tag name from a React element (return from a component)? For example:

function Foo() {
    return <span>Hello</span>;
}

The HTML tag name would be span. I know you can look into the type property of the React element, but it gets really difficult between SFC and normal components, and even harder when the component depth is rather large. For example:

function Bar() {
    return <Foo />;
}

Should still return span.