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.
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.
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 .
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
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With