为了账号安全,请及时绑定邮箱和手机立即绑定

怎么在html5中直接编译jsx

怎么在html5中直接编译jsx

肥皂起泡泡 2019-07-17 09:09:10
怎么在html5中直接编译jsx
查看完整描述

2 回答

?
ITMISS

TA贡献1871条经验 获得超8个赞

在html5中直接编译jsx的方法:
1、背景说明:
React的核心机制之一就是虚拟DOM:可以在内存中创建的虚拟DOM元素。React利用虚拟DOM来减少对实际DOM的操作从而提升性能。类似于真实的原生DOM,虚拟DOM也可以通过JavaScript来创建,例如:
var child1 = React.createElement('li', null, 'First Text Content');
var child2 = React.createElement('li', null, 'Second Text Content');
var root = React.createElement('ul', { className: 'my-list' }, child1, child2);

2、以上代码可读性并不好,于是React发明了JSX,利用熟悉的HTML语法来创建虚拟DOM:
var root =(
<ul className="my-list">
<li>First Text Content</li>
<li>Second Text Content</li>
</ul>
);

以上代码将XML语法直接加入到JavaScript代码中,让你能够高效的通过代码而不是模板来定义界面。
之后JSX通过翻译器转换到纯JavaScript再由浏览器执行。也就是用html引擎直接解析执行。


查看完整回答
反对 回复 2019-07-17
?
慕妹3242003

TA贡献1824条经验 获得超6个赞

/newscodejs.asp?lm2=84&list=5&icon=/img/fk.gif&tj=0&font=9&hot=0&new=0&line=0&lmname=0&open=1&n=36&more=0&t=0&week=0&zzly=0&hit=0&pls=0
这个文件显示的结果必须是js格式
如输出<img src="1.jpg" />
需要写成
document.write("<img src=\"1.jpg\" />")

查看完整回答
反对 回复 2019-07-17
  • 2 回答
  • 0 关注
  • 432 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信