Why ReactJS ReactDom.render() doesn't render HTML tags?

Question

why this code below doesn't work?

ReactDOM.render( <h1>Hello</h1>, document.getElementById('root'));

but this code works.

var elem = React.createElement('h1',{},"Hello");
ReactDOM.render( elem, document.getElementById('root'));

Coming back to react after long time..trying looking into the web.. didn't found it deprecated ? then why its not working?

Update: My browser console displays syntax error over here

 ReactDOM.render( <h1>Hello</h1>, document.getElementById('root'));

UPDATE: Thanks for the help everything worked by adding the following line

<script type="text/babel">

<h1> is not valid JavaScript, it's JSX. So in order to run JSX, you need a compiler. — jiyinyiyong
– jiyinyiyong, Commented Mar 6, 2017 at 9:10

Mayank Shukla · Accepted Answer · 2020-09-12 11:11:59Z

8

It is working, may be you are doing some other mistake, check this:

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>

<div id='root'/>

<script type="text/babel">
    ReactDOM.render( <h1>Hello</h1>, document.getElementById('root'));
</script>

edited Sep 12, 2020 at 11:11

answered Mar 6, 2017 at 8:45

Mayank Shukla

105k19 gold badges163 silver badges146 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Daksh Gupta Over a year ago

Hey I have added the CDN, without CDN React.createElement(...) would not have worked...

Mayank Shukla Over a year ago

ya, are you getting any error in console or on terminal ?

Daksh Gupta Over a year ago

yes, Updated the browser console error in the original question

Mayank Shukla Over a year ago

because you forgot to define the type="text/babel" check the updated answer it will work :)

Arun Prasad E S Over a year ago

I had to add the babel in website to get this to work stackoverflow.com/a/48414699/5237614

Collectives™ on Stack Overflow

Why ReactJS ReactDom.render() doesn't render HTML tags?

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related