third, JSX Grammar

The previous section of the code, the HTML language is written directly in the JavaScript language, without any quotation marks, this is the syntax of JSX, which allows the HTML and JavaScript to be mixed (view Demo02 ).

var names=[' Alice ',' Emily ',' Kate ']; Reactdom.Render(<div>{names.Map(function(name){return <div>hello< Span class= "token punctuation", {name}! </div> }} </div>. ( ' example '     

The above code embodies the basic syntax rules for JSX: encountering HTML tags (in<), parsing with HTML rules, encountering code blocks (in{beginning), it is parsed with JavaScript Rules. The result of the above code is as Follows.

JSX allows JavaScript variables to be inserted directly into the Template. If the variable is an array, all the members of the array are expanded (viewdemo03）。

var arr = [
];

Reactdom.render (
<div>{arr}</div>,
document.getElementById (' Example ')
);

third, JSX Grammar