laozhou_gui v1.0.1

laozhou_gui(简称zgui)是一个可以用序列化的dom结构来创建前端页面的GUI库。使用小案例：

let slider = {
    tag: "div",
    align: "row",
    size: [0, 50],
    style: {
        marginBottom: "20px"
    },
    children: [
        {
            tag: "input",
            type: "range",
            value: "10"
        },
        {
            tag: "button",
            size: [100, 0],
            textContent: "滑块测试"
        }
    ]
}
let search = {
    tag: "div",
    align: "row",
    size: [0, 50],
    style: {
        marginBottom: "20px"
    },
    children: [
        {
            tag: "input"
        },
        {
            tag: "img",
            size: [50, 50],
            src: ZGUI.icon.search
        }
    ]
}
let listbox = {
    tag: 'select',
    name: 'liebiao',
    size: 5,
    style: {
        display: "block"
    },
    children: [
        {
            tag: 'option',
            value: '张三',
            textContent: ' 张三'
        },
        {
            tag: 'option',
            value: '李四',
            textContent: ' 李四'
        },
        {
            tag: 'option',
            value: '王五',
            textContent: ' 王五'
        },
        {
            tag: 'option',
            value: '老六',
            textContent: ' 老六'
        },
        {
            tag: 'option',
            value: '横七',
            textContent: ' 横七'
        },
        {
            tag: 'option',
            value: '竖八',
            textContent: ' 竖八'
        }
    ]
}
let main = {
    tag: "div",
    align: "stack",
    children: [
        {
            tag: "div",
            bound: [0, 50],
            children: [
                slider,
                search,
                {
                    tag: "div",
                    align: "row",
                    size: [0, 450],
                    children: [
                        {
                            tag: "textarea",
                            size: [0, 400]
                        },
                        listbox
                    ]
                }
                ,
                {
                    tag: "button",
                    textContent: "运行",
                    drag: true,
                    onclick: function () {
                        console.log(this.textContent);
                        ZGUI.getDom("textarea").value = ZGUI.getDom("input")[1].value;
                    }
                }
            ]
        }
    ]
}
ZGUI.buildHtml(main);