Which statement best describes a JSX element?

Which statement best describes a JSX element?

• A. A basic unit of JSX found in a JavaScript file which is treated as, and has the functionality of, a JavaScript expression.
• B. A React component that must be defined using a function or class.
• C. A direct DOM node inserted into the page.
• D. A CSS class name used in JSX.

Answer: (B)

JSX elements are the building blocks you use to describe what the UI should look like in React. They aren’t actual DOM nodes yet; they’re descriptions that React will turn into UI. When you write JSX, it’s transformed into JavaScript expressions (usually calls to React.createElement) that produce React elements—plain objects describing what to render. A JSX element can represent either a standard DOM tag like <div /> or a custom component like <MyComponent />, so it isn’t limited to components alone. The idea is a JSX element is a basic unit in your JSX code that, after compilation, becomes a JavaScript expression that tells React what to render. That means the statement that a JSX element is a React component defined by a function or class isn’t accurate, since you can write JSX that renders plain DOM elements as well.

JSX elements are the building blocks you use to describe what the UI should look like in React. They aren’t actual DOM nodes yet; they’re descriptions that React will turn into UI. When you write JSX, it’s transformed into JavaScript expressions (usually calls to React.createElement) that produce React elements—plain objects describing what to render.

A JSX element can represent either a standard DOM tag like

or a custom component like , so it isn’t limited to components alone. The idea is a JSX element is a basic unit in your JSX code that, after compilation, becomes a JavaScript expression that tells React what to render.

That means the statement that a JSX element is a React component defined by a function or class isn’t accurate, since you can write JSX that renders plain DOM elements as well.