Easyui的渲染

Posted 2020-08-15 Leon (null)

 锻炼完身体九点到电脑旁，加上整理明天的接口文档，到现在22:38:10；-_-!!,心累

今天整理下Easyui是如何渲染的；

当我们 1 <input class="easyui-combobox" data-options="...." /> 写下这段话的时候，在页面中就会出现combobox控件，其中关键的语句是class中的类名easyui-combobx,easyui在页面加载的时候，都会把整个页面扫描一遍，把其中出现的easyui的类名就会渲染成Easyui各种控件组件。

这其实是EasyUI扫描的结果，在网页加载完成后，相当于在$(document).ready()事件中，对整个网页进行了一次扫描，发现某个input标签含有class="easyui-datebox"属性，就做上边讲到那些处理，不仅仅是EasyUI如此，几乎所有的UI都是这个原理。这其中就有了不得不说的重要知识点：$.parser.parse()

parser，就是解析器的意思，别看他只有那么几行代码，jQuery Easyui 能够根据class就能正常渲染页面全靠它了。

使用方法：

 1 $.parser.parse();// 解析整个页面 2 $.parser.parse($(‘#txtName‘).parent());/ 解析某个具体节点/

注意：为什么要加parent()呢，原因是parser只渲染对象（$(‘#txtBName‘)）的子孙元素，并不包括txtBName自身，而它的子孙元素并不包含任何Easyui支持的控件cla根据

 

根据渲染原理我们就知道如果在一些要禁用控件或者对控件的其他操作的时候一定要注意，对控件的赋值取值操作放在渲染操作后，否则在赋值语句后用了类似的语句.searchbox({‘readonly‘:‘true‘});(对searchbox控件设置只读)后会控件的值将丢失，原因就是组件被重新渲染！！

 

不哔哔了，哥哥要睡觉了，头好痛