In JSX, capitalization is used to distinguish between which two types of elements?

In JSX, capitalization is used to distinguish between which two types of elements?

• A. True
• B. It uses hooks
• C. Only for lowercase elements
• D. False

Answer: (A)

Capitalization in JSX signals whether you’re referring to a built-in DOM element or a React component. Lowercase tag names like div or span map directly to HTML elements in the DOM. Uppercase names like MyButton or App indicate a React component defined in your code (either a function or a class) that returns JSX. When JSX is compiled, these two paths differ: lowercase tags become strings for DOM nodes, while uppercase identifiers become component references that React will render by calling your component. This is why the statement that capitalization distinguishes between these two kinds of elements is true. For example, <div /> renders an HTML div, whereas <MyButton /> renders whatever the MyButton component returns. If you write a component with a lowercase first letter, React treats it as a DOM tag name, which usually isn’t what you intend.

Capitalization in JSX signals whether you’re referring to a built-in DOM element or a React component. Lowercase tag names like div or span map directly to HTML elements in the DOM. Uppercase names like MyButton or App indicate a React component defined in your code (either a function or a class) that returns JSX. When JSX is compiled, these two paths differ: lowercase tags become strings for DOM nodes, while uppercase identifiers become component references that React will render by calling your component. This is why the statement that capitalization distinguishes between these two kinds of elements is true. For example,

renders an HTML div, whereas renders whatever the MyButton component returns. If you write a component with a lowercase first letter, React treats it as a DOM tag name, which usually isn’t what you intend.