Element

UVUE DOM 元素对象，描述了 UVUE DOM 元素所普通具有的属性和方法。

Element 属性值

名称	类型	必备	默认值	描述
firstChild	Element	否	-	获取当前元素的的第一个子元素，如果元素是无子元素，则返回 null。
lastChild	Element	否	-	获取当前元素的最后一个子元素，如果没有子元素，则返回 null。
parentElement	Element	否	-	获取当前元素在 DOM 树中的父元素，如果没有父元素（如未添加到DOM树中），则返回null。
previousSibling	Element	否	-	获取当前元素的前一个同级元素，没有则返回null。
nextElementSibling	Element	否	-	获取在 DOM 树中紧跟在其后面的同级元素，如果指定的元素为最后一个元素，则返回 null。
children	Array<Element>	是	-	获取当前元素包含的子元素的集合
tagName	string	是	-	获取当前元素的标签名
dataset	Map<string, any>	是	-	获取元素上自定义数据属性（data-*）的集合
attributes	Map<string, any>	是	-	获取元素上所有属性元素的集合
style	CSSStyleDeclaration	是	-	获取元素的CSS样式对象
scrollWidth	number	是	-	获取可滚动元素内容的总宽度，仅scroll-view、list-view组件支持，其他组件返回视图宽度
scrollHeight	number	是	-	获取可滚动元素内容的总高度，仅scroll-view、list-view组件支持，其他组件返回视图高度
scrollLeft	number	是	-	获取元素滚动条到元素左边的距离像素数，仅scroll-view、list-view组件支持。其他组件返回0
scrollTop	number	是	-	获取元素滚动条到元素顶部的距离像素数，仅scroll-view、list-view组件支持。其他组件返回0
offsetLeft	number	是	-	元素的左边界偏移值 单位px
offsetTop	number	是	-	元素的右边界偏移值 单位px
offsetWidth	number	是	-	元素高度 单位px
offsetHeight	number	是	-	元素宽度 单位px
ext	Map<string, any>	是	-	扩展属性

注意： App端Element所有属性仅支持获取，不支持设置修改

方法

appendChild(aChild)

将一个元素添加到指定父元素的子元素列表的末尾处。如果将被插入的元素已经存在于当前文档的文档树中，那么将会它从原先的位置移动到新的位置。

参数

名称	类型	必填	默认值	描述
aChild	Element	是	-	插入子元素对象

insertBefore(newChild, refChild?)

在参考元素之前插入一个拥有指定父元素的子元素。如果给定的子元素是对文档中现有元素的引用，insertBefore() 会将其从当前位置移动到新位置。

参数

名称	类型	必填	默认值	描述
newChild	Element	是	-	插入子元素对象
refChild	Element	否	-	已存在父元素的子元素对象

setAttribute(key, value?)

设置指定元素上的某个属性值。如果设置的属性已经存在，则更新该属性值；否则使用指定的名称和值添加一个新的属性。

注意 setAttribute从HBuilderX 3.93起，调整为只能保存string类型属性值，需要保存其它类型数据请使用dataset属性。

参数

名称	类型	必填	默认值	描述
key	string	是	-	属性名称
value	any	否	-	属性值域 可为空

getAttribute(key)

获取元素指定的属性值，如果指定的属性不存在则返回null。

注意 getAttribute返回值从HBuilderX 3.93起，调整为string类型，不要使用此方法获取非string类型的属性值。如有非string需求，请使用对象的点操作符直接访问dateset属性，不通过getAttribute方法。

参数

名称	类型	必填	默认值	描述
key	string	是	-	属性名称

返回值

类型	必备
any	否

hasAttribute(key)

返回改元素是否包含有指定的属性，属性存在则返回true，否则返回false。

参数

名称	类型	必填	默认值	描述
key	string	是	-	属性名称

返回值

类型
boolean

removeAttribute(key)

从元素中删除一个属性，如果指定的属性不存在，则不做任何操作，也不会产生错误。

参数

名称	类型	必填	默认值	描述
key	string	是	-	属性名称

getBoundingClientRect()

获取元素的大小及其相对于窗口的位置信息。

返回值

类型
DOMRect

getDrawableContext()

获取组件的绘制对象，仅uvue页面中的 view 组件支持，其它组件不支持则返回null。

返回值

类型	必备
DrawableContext	否

addEventListener(type, callback)

将指定的监听器注册到元素对象上，当该对象触发指定的事件时，指定的回调函数就会被执行。

参数

名称	类型	必填	默认值	描述
type	string	是	-	事件类型
callback	(event: T) => R	是	-	事件监听器 T表示event类型，R表示返回值类型

removeEventListener(type, callback?)

删除使用 addEventListener 方法添加的事件监听器。

参数

名称	类型	必填	默认值	描述
type	string	是	-	事件类型
callback	(event: T) => R	否	-	事件监听器 T表示event类型，R表示返回值类型

removeChild(aChild)

从元素中删除一个子元素，返回删除的元素。

参数

名称	类型	必填	默认值	描述
aChild	Element	是	-	被删除子元素对象

返回值

类型
Element

remove()

把元素对象从它所属的 DOM 树中删除。

dispatchEvent(type, value)

向一个指定的事件目标派发一个 Event，并以合适的顺序（同步地）调用此事件的监听器回调函数。

参数

名称	类型	必填	默认值	描述
type	string	是	-	事件类型
value	Event	是	-	事件返回对象

scrollTo(x, y)

使界面滚动到给定元素的指定坐标位置 仅scroll-view、list-view组件支持

参数

名称	类型	必填	默认值	描述
x	number	是	-	x轴要滚动到坐标位置(单位px)
y	number	是	-	y轴要滚动到坐标位置(单位px)

scrollBy(x, y)

使得元素滚动一段特定距离 仅scroll-view、list-view组件支持

参数

名称	类型	必填	默认值	描述
x	number	是	-	x轴要滚动的距离(单位px)
y	number	是	-	y轴要滚动的距离(单位px)

focus()

使元素获取焦点 仅input、Textarea组件支持

blur()

使元素丢失焦点 仅input、Textarea组件支持

takeSnapshot(options)

对当前组件进行截图，调用此方法会将当前组件（包含子节点）渲染结果导出成图片。 成功会返回图片对应的临时文件路径，目前默认png格式

参数

名称	类型	必填	默认值	描述
options	TakeSnapshotOptions	是	-	组件截图的参数对象

takeSnapshot 兼容性

安卓系统版本	安卓 uni-app	安卓 uni-app-x	iOS 系统版本	iOS uni-app	iOS uni-app-x
5.0	x	3.93	x	x	x

// 找到需要截图节点
const view = uni.getElementById('snapshot-content')!
// 进行截图
view.takeSnapshot({
    success: function (res) {
        // 打印截图文件临时路径
        console.log(res.tempFilePath)
        uni.showToast({
            title: '截图成功，路径：' + res.tempFilePath,
            icon: "none"
        })
    },
    fail: function (res) {
        console.log(res)
        uni.showToast({
            icon: 'error',
            title: '截图失败'
        })
    }
})

完整示例代码参考hello uni-app x