javascript入门之 ztree（五自定义字体）

<!--<!DOCTYPE html>-->

<!--<HTML>-->

<!--<HEAD>-->

    <!--<TITLE>zTree测试</TITLE>-->

    <!--<meta http-equiv="content-type" content="text/html; charset=UTF-8">-->

    <!--<link rel="stylesheet" href="../bower_components/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">-->

    <!--<script type="text/javascript" src="../js/jquery-3.3.1.js"></script>-->

    <!--<script type="text/javascript" src="../bower_components/ztree/js/jquery.ztree.all-3.5.js"></script>-->

    <!--<SCRIPT LANGUAGE="JavaScript">-->

        <!--var zTreeObj;-->

        <!--// zTree 的参数配置，深入使用请参考 API 文档（setting 配置详解）-->

        <!--var setting = {};-->

        <!--// zTree 的数据属性，深入使用请参考 API 文档（zTreeNode 节点数据详解）-->

        <!--var nodes = [-->

            <!--{name: "父节点1", children: [-->

                    <!--{name: "子节点1"},-->

                    <!--{name: "子节点2"}-->

                <!--]}-->

        <!--];-->

        <!--$(document).ready(function(){-->

            <!--zTreeObj = $.fn.zTree.init($("#first"), setting, nodes);-->

        <!--});-->

    <!--</SCRIPT>-->

<!--</HEAD>-->

<!--<BODY>-->

<!--<div>-->

    <!--<ul id="first" class="ztree"></ul>-->

<!--</div>-->

<!--</BODY>-->

<!--</HTML>-->

<!DOCTYPE html>

<HTML>

<HEAD>

    <TITLE> ZTREE DEMO - Standard Data </TITLE>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <link rel="stylesheet" href="../bower_components/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">

    <script type="text/javascript" src="../js/jquery-3.3.1.js"></script>

    <script type="text/javascript" src="../bower_components/ztree/js/jquery.ztree.all-3.5.js"></script>

    <SCRIPT type="text/javascript">

        var setting = {

            view: {

                fontCss: getFont,

                nameIsHTML: true

            }

        };

        var nodes =[

            { name:"百度", font:{'font-weight':'bold'} ,url:"http://www.baidu.com/", target:"_blank"},           //超链接到 百度

            { name:"斜体字", font:{'font-style':'italic'}},

            { name:"有背景的字", font:{'background-color':'black', 'color':'white'}},

            { name:"红色字", font:{'color':'red'}},

            { name:"蓝色字", font:{'color':'blue'}},

            { name:"<span style='color:blue;margin-right:0px;'>view</span>.<span style='color:red;margin-right:0px;'>nameIsHTML</span>"},

            { name:"zTree 默认样式"}

        ];

        function getFont(treeId, node) {

            return node.font ? node.font : {};

        }

        $(document).ready(function(){

            $.fn.zTree.init($("#sys"), setting, nodes);

        });

    </SCRIPT>

</HEAD>

<BODY>

<div class="content_wrap">

    <div class="zTreeDemoBackground left">

        <ul id="sys" class="ztree"></ul>

    </div>

</div>

</BODY>

</HTML>

javascript入门之 ztree（五自定义字体）的更多相关文章

javascript入门之 ztree（四自定义Icon）
<!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - Standard Data </TITLE& ...
javascript入门之 zTree（十四增删查改）（一）
<!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - beforeEditName / beforeRe ...
javascript入门之 zTree（十四增删查改）（二）
<!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - addNodes / editName / rem ...
javascript入门之 zTree（十三移动/复制事件）
<!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - copyNode / moveNode</T ...
javascript入门之 zTree（十二托拽事件（二））
1.逻辑可能有不完善的地方,如果发现,请指出. <!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - d ...
javascript入门之 zTree（十一托拽事件（一））
<!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - drag & drop</TITLE ...
javascript入门之 ztree (十 checkbox选中事件)
<!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - beforeCheck / onCheck< ...
javascript入门之 ztree (九单/复选框问题)
<!DOCTYPE html> <HTML> <HEAD> <meta http-equiv="content-type" content ...
javascript入门之 ztree (八一系列鼠标事件)
<!DOCTYPE html> <HTML> <HEAD> <meta http-equiv="content-type" content ...

随机推荐

Echart饼形图和折线图的循环展示及选择展示
需求:根据不同的入参调同一接口,循环展示一组饼形图或折线图: 主要问题:在于给定的数据格式不符合图表的配置项格式,需要拆分组装数据:首先默认展示几个图表,当选中一个类别,需要展示其中一个的时候,页面中 ...
js Array方法总结
修改器方法(9) copyWithin(target: number, start: number, end?: number): this; // 浅复制数组的一部分到同一数组中的另一个位置,并返回 ...
建议8:恰当选用if和switch
相对来说下面几种情况更适合switch结构枚举表达式的值.这种枚举是可以期望的,平行逻辑关系的表达式的值具有离散性,不具有线性的非连续的区间值表达式的值是固定的,不是动态变化的表达式的值是有限 ...
部署prometheus监控kubernetes集群并存储到ceph
简介 Prometheus 最初是 SoundCloud 构建的开源系统监控和报警工具,是一个独立的开源项目,于2016年加入了 CNCF 基金会,作为继 Kubernetes 之后的第二个托管项目. ...
JVM 参数(转)
Herry灬凌夜转自:https://www.cnblogs.com/wuyx/p/9627542.html 常用的JVM配置参数一.Trace 跟踪参数在Eclipse中,如何打开GC的监控 ...
Natas34 Writeup（闯关结束！）
Natas34: 登录什么都不用做,闯关结束!撒花~~~
ERP系统定价模型及费用组成
很多人选择ERP系统的时候最关心的就是费用问题,因为很多中小企业资金都是比较缺乏的,如果需要使用大量的金钱来购买ERP系统这是不现实的.你知道ERP系统的定价模型有哪些吗?你知道影响ERP系统价格的因 ...
WxPython 4.0.4多线程访问UI
最开始做框架的时候的需求就是多线程访问UI,以前在.NET WPF使用MVVM和数据驱动很容易做到,在JavaSwing中使用另类的观察者模式也实现了.在WxPython中使用观察者模式直接程序崩溃, ...
springboot整合dubbo+zookeeper最新详细
引入最近和小伙伴做一个比赛,处于开发阶段,因为涉及的服务比较多,且服务需要分开部署在不同的服务器上,讨论之后,打算采用分布式来做,之前学习springboot的时候,部分章节涉及到了springbo ...
Linux - 文件的三种时间之atime、ctime、mtime的区别和简单用法
在Linux中,文件或者目录中有三个时间属性 atime ctime mtime 简名全名中文作用 atime Access Time 访问时间最后一次访问文件(读取或执行)的时间 ctime ...

javascript入门 之 ztree（五 自定义字体）

javascript入门 之 ztree（五 自定义字体）的更多相关文章

随机推荐

热门专题

javascript入门之 ztree（五自定义字体）

javascript入门之 ztree（五自定义字体）的更多相关文章