00:02
哎嗯，然后跳转过来以后哈，我们说想在这里边诶，根据我们后端给查询到的数据呢，来显示这个树形结构，那么我们需要引入这个Z的环境啊，就这个东西呢，是以这个Z用借助Z这个插件来实现的啊，这个如果我们自己手写的话，这个就封了哈，这个这个这里边涉及到东西太多了。哎，所以说下一步呢，就是我们说这个代码哈。呃，我们要引入这个J翠的环境。先看一下在我们这个。嗯，样式里边哈，这个Z这已经打进来了，这是Z的CSS，这Z的GS啊，这个已经有了啊，我们这个就是确认一下就好。就是这个已经有了。
01:00
确认一下就行了。Control c。嗯。嗯。然后这个下一步是在页面上去引入啊，页面上去引入，页面上需要引入啥呢？就是咱们也可以看一下这个原型啊，参考一下。这里边呢，这是J的哈，它需要引入一个J的style。这个CSS文件。然后呢？看下边哈，它需要引入一个J的JS，当然要放到解query的后边啊，它也是没有解query，它也是工作不了的，解query点接触嘛，啊，就需要把这两个导进来，我们来看一下在我们这儿的一个路径。嗯，CTRLC。这个link这个标签呢。
02:00
HEF哈等于Z。下边的塔完了，这个link呢，还得写一个这玩意儿。我每次都记不住这玩意儿怎么写。这是它的CS，这是样式，然后它的GS。嗯，就是它哈，这个在Z的下边。找一下他。这是我们页面上引入这个环境。页面呢，是我们这个manual page。
03:01
哎，然后，嗯。嗯，下一步呢，说这个看我们这个代码怎么写。啊，这个j query啊上手就是这个啊，这个这这个就是啊，就是肯定是要写的。然后呢？下边具体这个代码哈，我们可以参考一下，这个Z呢，它会给了一些个DEMO。啊。咱们英语水平不好，看一下这个中文的。这个其实这个C呢，它功能特别丰富。就说你就看吧，这他这这些当然都是他这他自己写的哈。这里边儿这功能哈，这个特别特别的多啊，这个也很也是也算是这个很强大的很很很很强大的这样一种这个一个工具啊，能写出来这个应该也挺了不起的，嗯。
04:01
这他也没说是是是是这个一个人还是团队哈，咱们现在呢，是参考这个哈，标准接数据，咱们参考他。诶参考它这边呢，是他给的一个例子，我们咱们说这边咱们先就不看这些了啊，咱们直接看这个例子。呃，这个例子呢，它放在哪儿了哈，这个是一个什么，这是个F。啊，这是个。呢，相当于，呃，我看看啊。哎，F frame是这个I frame相当于在浏览器窗口里边又开了一个小窗口。啊，它是一个小窗口。然后呢，我们在这里边呢，点右键哈，查看框架的源代码，就是I frame里边这一部分的代码。哎，看一下他这个怎么写呢，首先呢是。呃，声明了一个变量叫setting等于一个空的计算对象。
05:05
那将来这个东西呢，就是放我们对Z的各种设置放在这个里边啊，现在刚开始咱们可以先用这个叫。呃，空的设置啊，就是没有任何的。呃，不做任何设置，都使用默认值。啊，所以说这个第一步先声明啊，先创建一个接森对象。用于存储。对J。所做的设置。我们去一个setting。等于啊。第二步呢，我们就准备生成树形结构的，哎，这个数据。这个数据当然也是阶层数据。这个呢，你看它这叫做z nose。Z就是Z的代表啊，Nod就是节点，No表示有很多节点。我们把这个拿过来就是可以先。
06:03
像他这样，像他这样显示一组这个。等于说假数据啊，先是这个假数据。哎，把这个拿过来。然后呢，再下一步。它这个东西document.ready呢，就相当于是我们的这个了啊，所以这个我们就不用加了，看它下边这个dollar.fn。点C点一啊，这是一个Z的一个初始化的一个操作。然后呢，这个东西是什么呢？用解块选择器去找到我们的。这个叫这个部分。就找到它，哎，就是这个找到我们这Z的所有的节点，动态的节点所附着的一个静态的节点啊，就是这个ul，这个是一定要有的。啊，这个我们这儿也有啊，我们这儿也有就加了他了啊。这个ul标签是Z。
07:05
呃，动态生成的。节点所依附。依附的静态节点。啊，就都放在他这里边。哎，然后呢，再往后我们说这个。Setting传进来，就是这个设置传进来，Z传进来啊，就是这个节点传进来，我们把这个呢，咱们就复制一下啊。呃，就放到这个ZS的后边。这个叫我们叫。嗯。初始化树形结构。哎，这个名咱们也叫这个名，所以这个呢，咱们就等于说，其实把它的一个例子呢，先粘过来，先初步的看一下这个效果。跑一下。咱们一步一步的来啊。
08:00
嗯。咱们在这儿记下啊这个代码。页面。上使用这个计税。哎，显示。嗯。初步显示这个数。树形结构。啊，这是这个假数据。咱们先跑一下看看对不对哈。哦，对了，我们这菜单维护这个地方还没有加这个链接啊，我们把塞B这打开。加上我们就可以点了。菜单维护啊。这叫。Menu。Menu下边的two page加什么？
09:02
过来显示的这个东西就和它这个例子里边。这显示的这个是一样的啊，你看这个负节点默认是展开的，后边这些呢，都是默认都是收起来的。就是这么一个效果啊，这一组数据和我们的这个zno的这儿呢是对应的。啊，第一个负节点呢，它的open是处，它是展开的，后边其他这些呢。嗯，诶，这儿还有一个啊。嗯，但是它的负节点是折叠的啊，这个得你得把它这个再展开。这个是展开的，但是它的负节点是折叠的啊，都是对应的啊，这肯定是没有错的。就是先初步先显示一下。
我来说两句