2.1 JSX介紹

JSX其實就是JavaScript XML的縮寫，直譯過來就是基于JavaScript的XML。同時，JSX作為一種JavaScript語法擴展，支持自定義屬性，并具有很強的擴展性。由于JSX是React框架內置的語法，且專用于React應用開發，因此建議設計人員使用JSX方式來實現UI中的虛擬DOM。

若要在React項目中使用JSX語法，則必須引用“babel.js”來解析JSX，且在<script>標簽中必須改用“type="text/babel"”屬性。這里解釋一下這么做的原因，在使用“type="text/babel"”屬性替換“type="text/javascript"”屬性后，瀏覽器內置的JavaScript解釋器就不會解析<script>標簽里的腳本代碼，轉而由“babel.js”進行解析，從而避免React代碼與原生JavaScript代碼發生混淆。

介紹了以上關于JSX的知識點，下面看一下JSX的一般語法形式。

這里使用const關鍵字定義常量名（element），表示JSX代碼的名稱。<tag-level-i>標簽元素表示DOM標簽，且支持多級嵌套的形式。