I'm trying to make a h1 with JavaScript and it gives me this error:
TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
The code:
function append(child) {
document.body.appendChild(child);
};
const title = React.createElement(
'h1',
null,
'Hello World',
);
append(title);
console.log(header);
React elements are not DOM elements, so you can't use them with appendChild.
You'll want to either use the DOM directly or use React, but usually not both (or at least, typically in a React project the amount of direct DOM manipulation you do is fairly minimal).
Here's that code using the DOM (no React):
function append(child) {
document.body.appendChild(child);
}
const title = document.createElement("h1");
title.textContent = "Hello world";
append(title);
console.log(title); // Changed `header` to `title`, you have no `header` element in the code
Doing the same with React, you wouldn't typically have an append function like yours. You'd have a single call to ReactDOM.render in the entire project (usually) that mounted your top-level React component in a DOM element; everything else would be rendered by React as part of handling the component logic.