【EASYDOM系列教程】之 Element 对象

DOM 的标准规范中提供了 Element 对象,该对象提供了 HTML 页面中所有元素所具有的属性和方法。

我们都知道 DOM 标准规范中提供了 Node 对象,主要是依靠 DOM 节点树结构访问和更新 HTML 页面的内容。而 DOM 标准规范中提供了 Element 对象,主要是依靠 DOM 元素树结构访问和更新 HTML 页面的内容。

值得注意的是: 所有的 HTML 页面的元素都是 HTMLElement 对象,而这个对象又是继承于 Element 对象的。

Element 对象的作用

HTML 页面中的标签,既是元素节点,又是元素。

如果我们将 HTML 页面中的标签当做元素节点的话,就是利用 DOM 节点树结构进行解析和操作。但是,有些情况利用 Node 对象实现比较复杂,例如属性节点的操作,而使用 Element 对象提供的属性和方法相对会简单一些。

我们可以简单地理解 Element 对象是 Node 对象的补充。当然,这种理解并不准确!

通过 Element 对象,我们可以实现遍历元素、属性操作等操作。而这些操作也正是我们要学习 Element 对象的属性和方法。

测试 Element 对象

由于 Element 对象是 DOM 底层封装的对象,所以我们并不能通过直接打印 Element 对象来查看其属性或方法。
而是要通过打印 Element 对象的 prototype 原型属性来查看其属性或方法。

console.log(Element.prototype)

运行 HTML 页面后,打开 开发者工具,我们可以看到以下内容:

图片描述

上面运行后的结果只是部分内容,并不是全部内容。请自行测试!


本教程免费开源,任何人都可以免费学习、分享,甚至可以进行修改。但需要注明作者及来源,并且不能用于商业。

本教程采用知识共享署名-非商业性使用-禁止演绎 4.0 国际许可协议进行许可。

图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值