关于JSX与HTML的差异
来源:互联网 发布:淘宝发货物流其他 编辑:程序博客网 时间:2024/06/05 00:21
JSX:是javascript的语法扩展,让我们在javascript中可以编写像html一样的代码。
JSX与HTML定义行内事件的差异:
1、JSX中,添加行内onClick事件,不同于HTML行内事件,jsx中的原理是使用事件代理的方式,进行添加的事件。原因如下:
(1)jsx中,既可以给dom元素,又可以给react组件进行添加事件。
注意: react中区分dom元素和react组件的方式是根据首字母的大小写判定的。
(2)jsx中,通过onClick挂载的每一个函数都可以控制在单个组件中,不会污染全局。
(3)jsx中,无论给多少个组件进行事件挂载,都是通过事件委托,给一个dom元素进行事件挂载的,效率高
(4)在react的生命周期中,当unmount时,会清除所有的相关事件,避免了内存泄露。
(5)在jsx中,也可以定义样式。见例子。
2、HTML中,添加行内onclick事件,不推荐,原因如下
(1)onclick事件是在全局环境下执行的,污染全局
(2)直接给很多dom元素添加onclick事件,影响网页性能。
(3)对于使用onclick的dom元素进行动态删除时,需要及时删除掉dom元素的事件,否则如果直接删除dom,容易造成内存泄露。
阅读全文
0 0
- 关于JSX与HTML的差异
- 【Html】XHTML 与 HTML 之间的差异
- 关于<meta>标签的开闭 HTML 与 XHTML 之间的差异
- HTML表单与ASP表单的差异
- XHTML 与 HTML 之间的差异
- XHTML 与 HTML 之间的差异
- XML与HTML的主要差异
- JSX,Html语法需注意的部分
- JSX,Html语法需注意的部分
- 实战json、html、jsx的互转
- HTML 4与HTML 5 的标签差异比较
- 事件 HTML 4.01 与 HTML 5 之间的差异
- 02React的JSX 与Style
- XHTML 与 HTML 之间的差异(二)
- 关于Hashtable与Dictionary差异
- FF与IE关于height width理解的差异
- 关于c++中const与c的差异
- 中国与美国关于生命权的差异
- python-str对象及操作
- Dom操作
- 购买SSL证书必须考虑的五大因素
- WKWebView 加载本地JS、htlm文件
- elasticsearch基础
- 关于JSX与HTML的差异
- qt-5.6.0 移植之qt源码编译----configure选项分析
- 正则表达式中?的用法
- Java菜鸟学习日记41
- 程序员面试之九阴真经
- CodeForces
- js随机点名 方式 和 js生成随机数 案例
- longest-common-prefix
- Python获取两个日期之间的列表