内置标签及自定义组件的使用

内置标签的使用

内置标签与原生标签一样、只不过汉化了中文名字、方便用户使用;在编译时会输出为原生标签;例如按钮会被编译为button、输入框会被编译为input;因此在使用时与原生HTML开发一模一样;而对其数据值的操作、可以通过documen对象以及内置函数操作;

例如:对指定div设置一个id、再通过内置函数“取元素ByID”则可以获取该div标签对象、从而实现对该标签进行各项支持的操作。

设置内容、修改Style样式、设置HTML内容等等。

<容器 ID="div1">
    我是DIV1的默认文本内容
</容器>
<输入框 提示文本="请输入密码" 类型="密码" />
<编辑框 提示文本="请输入多行内容"></编辑框>

在按钮被单击事件或函数中:

函数 按钮2被单击()
    变量 div1 = 取元素ByID("div1")
    调试输出(div1)
    ' 修改容器中的文本内容
    div1.innerText = "我是修改的内容"
    ' 修改容器中的HTML内容
    div1.innerHTML = "<span style='color:red;'>我是加载的HTML内容</span>"
结束 函数
注册内置标签事件

内置标签的事件、可以在页体中为其注册;也可以通过内置函数“注册事件ByID”、“注册事件By类名”、“注册事件By元素名”注册。

在页体中注册:

<按钮 被单击="按钮1被单击()">点击我</按钮>
<按钮 onclick="按钮2被单击()">点击我2</按钮>

其中被单击、onclick为事件名称、可以参考核心库/全局属性;原生英文事件名称可参考:HTML 事件 - 菜鸟教程

在函数中动态注册:

函数 动态注册事件()
    ' 为ID等于 div1 的元素注册被单击事件;当元素被单击时将会在控制台输出被单击的对象及事件
    注册事件ByID("div1","click",(源对象,事件源)=>{
        调试输出(源对象)
        调试输出(事件源)
    })
    ' 为样式类等于 myCls 的所有元素注册被单击事件;当元素被单击时将会在控制台输出被单击的对象及事件
    注册事件By类名("myCls","click",(源对象,事件源)=>{
        调试输出(源对象)
        调试输出(事件源)
    })
    ' 为元素名称等于按钮(button)的所有元素注册被单击事件;当元素被单击时将会在控制台输出被单击的对象及事件
    注册事件By元素名("button","click",(源对象,事件源)=>{
        调试输出(源对象)
        调试输出(事件源)
    })
结束 函数

自定义组件

自定义组件指所有非内置组件、及原生元素;例如:以LY开头的组件为封装自LayUI的自定义扩展组件;在项目中创建的自定义可视组件等等。

自定义组件的使用与原生元素略有不同;最大的区别在于事件的处理上;在页体中使用时与基础元素的定义格式基本一样;可设置默认属性值;但该属性值不支持模板变量;结尾标签必须在内部结尾、且必须包含ID;例如:

<LY按钮 ID="ly1" /> 
<LY编辑框 ID="bjk1" 内容="我是内容" 文本尺寸="30px" />
' 修改属性
bjk1.内容 = "修改后的内容"
bjk1.文本尺寸 = "10px"
事件注册

针对自定义组件的事件;不支持像原生标签那样注册;因为自定义组件的事件是在组件封装时独立声明的;其统一语法为:置XXX回调 ;例如:

按钮1.置被单击回调((事件源)=>{
    调试输出(事件源)
})