前情提要
由于项目需要，（非常老久的项目），css 需要修改，在这里要实现效果类似 element-ui / layui-tree :
实在没有办法，感觉只能修改源码才能符合标准。。。
条件设置
- 文件：jquery.ztree.all-3.5.js
- 官网： API 文档
- ztree 源码版本粗略认识：
- jquery.ztree.core.js：是zTree的核心库，包括基本的展示功能。
- jquery.ztree.excheck.js：是zTree关于复选框/单选框的扩展库。
- jquery.ztree.exedit.js：是zTree关于编辑操作的扩展库。
- jquery.ztree.exhide.js：是zTree关于节点隐藏的扩展库。
- jquery.ztree.all.js：是core+excheck+exedit的组合（不包含exhide）
- 当前只粗略看下 core ，即 到 1764 行 代码。可以看下 all 里面的 三部分：
使用如下
- js ：
- 可以看下 加载之后的 html dom 结构 -> html:
其中主要组成是ul 、 li 、a 、span （switch, ico, name） - 其中 css 进行了一些修改，比较简单。效果如下：
源码内容粗略分析
1. core 结构如下：
三个 全局的 临时变量： settings 、roots 、caches
2. _consts : 固定的一些设置 -> 比较简单，应该是用于组装 html 过程中使用的
其中 switch 和 line 是在这里：
icon 如下：
a 标签：
li 标签： 表示 每个等级的 每一项，包含其子节点
ul 标签： 最外层包含
3. _setting 初始化默认配置（options）【可以看到 API 文档中 配置详解】：
4. 一些初始化等
_initRoot： 初始化 root
使用 Root 来保存完整的数据
默认的 root 的核心
_initCache ： 初始化 缓存
_bindEvent ： 根据配置 进行 回调函数的 绑定， 绑定一些 事件 （7 个事件）
_unbindEvent ： 解绑 7 个事件
用了 链式调用，主要是 bind 函数的 返回值 应该也是 treeObj
_eventProxy: 事件代理
node 的事件：
zTree 的事件：
代理结果：
_initNode: 初始化节点的核心函数
基本上都可以从 命名来看出 作用，
_init: 初始化的 对象， 其中都是数组
5. data ： 操作 数据 的 方法们
粗略数一数 ，包括 48个 函数
查看如下：
具体内容大体就是 for 等等遍历，判断，赋值
供其他对象的 函数 使用，其中 data 和 tools 就是给别的 对象 使用的。
6. event ： 事件代理 的 函数
六个函数，粗略可以通过函数名 知道作用
7. handler ： 事件处理的 具体 的函数， 包括 6 个 执行回调函数
通过 调用 view 上面的 事件函数 来绑定对应的事件。
8. tools ：一些工具函数， 例如 绑定事件、深度拷贝 ……
看函数名多半可以看出作用，但是具体作用不一定了解。
9. view ： 操作 ztree dom 的 方法们
粗略看 四十个左右的函数
具体如下：
11 个函数， 结点操作有关
appendNodes
可能 改 dom 组装顺序就是改这里
15 个 制作 html 的 结点
- makeDOMNodeIcon
makeDOMNodeLine
13 个 函数，同样操作结点，包括 初始化设置函数、删除等
10. zTree 定义 和 外部可以引用（暴露）
consts 、_z 有特定的功能和作用
getZTreeObj: 根据 treeId 获取 树的 Jquery 对象
destroy : 根据 treeId 销毁树
zt、$$ 、consts 都是指针地址的复制。
init ： 是入口函数，开始执行组装函数，非常重要
如果想要详细查看 说明，可以查看 API 网站（https://www.jyvtc.edu.cn/dzb/uiFramework/js/zTree-v3.2/api/API_cn.html）
本文作者：
jeneen
发布时间： 2022-05-05
最后更新： 2023-05-09
本文标题： jquery.ztree 源码阅读 - 粗略阅读
本文链接： https://zx1001011.github.io/2022/05/05/read-jquery-ztree-code/
版权声明： 本作品采用 CC BY-NC-SA 4.0 许可协议进行许可。转载请注明出处！
发布时间： 2022-05-05
最后更新： 2023-05-09
本文标题： jquery.ztree 源码阅读 - 粗略阅读
本文链接： https://zx1001011.github.io/2022/05/05/read-jquery-ztree-code/
版权声明： 本作品采用 CC BY-NC-SA 4.0 许可协议进行许可。转载请注明出处！
