资讯专栏INFORMATION COLUMN

【EASYDOM系列教程】索引

yanwei / 3230人阅读

摘要:系列教程是一套免费开源,任何人都可以免费学习分享,甚至可以进行修改。本文是这套系列教程的索引也就是目录第一回介绍在最开始,我们先来了解是什么的作用,以及浏览器的支持是怎么样的。

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

本文是这套系列教程的索引(也就是目录):

第一回 DOM 介绍

在最开始,我们先来了解 DOM 是什么、DOM 的作用,以及浏览器的支持是怎么样的。

第二回 DOM 树结构

现在我们知道了 DOM 是什么,再让我们了解一下 DOM 树结构、节点是什么,以及节点在 DOM 树结构中的关系。

第三回 Document 对象介绍

在这个系列的前两篇,我们掌握了 DOM 中非常重要的概念。接下来我们将学习 DOM 中核心对象之一的 Document 对象。

第四回 定位页面元素

在对 Document 对象有了基本了解之后,我们将学习 Document 对象中很重要的功能 - 就是如何定位页面元素。

第五回 创建页面元素

Document 对象除了提供了定位页面元素的功能之外,还提供了如何创建页面元素。也是这一回我们将学习的内容。

第六回 Node 介绍

到此,我们已经掌握了 Document 对象在 DOM 中的功能。接下来,我们将继续学习 DOM 中核心对象之一的 Node 对象。

第七回 判断节点类型

DOM 节点树结构中,有常见的四种节点类型,我们经常需要先区分再操作。这一回中,我们将学习如何判断节点的类型。

第八回 遍历节点

通过 DOM 访问 HTML 页面主要依靠 DOM 节点树结构,具体操作则依靠节点之间的关系。而本回中,我们就是学习如何利用节点之间的关系实现遍历节点。

第九回 插入节点

在前几回中,我们掌握了通过 Node 对象如何访问 HTML 页面。在这一回中,我们将学习如何向 HTML 页面添加节点。

第十回 删除节点

Node 对象除了提供了如何向 HTML 页面添加节点的功能,还提供了如何从 HTML 页面中删除节点。

第十一回 替换节点

在这一回中,我们继续学习 Node 对象提供的实现将新节点替换 HTML 页面中现有的节点的功能。

第十二回 复制节点

Node 对象提供的常见节点操作中,我们将学习如何实现复制(克隆)节点的功能。

第十三回 textContent 属性

关于 Node 对象提供的属性和方法中,最后我们还要再学习其 textContent 属性,实现获取或设置指定节点的文本内容。

第十四回 Element 介绍

如果你已经看到了这里,说明你已经掌握了 DOM 标准规范中的两个核心对象 Document 和 Node 对象。接下来,我们将继续学习 DOM 中核心对象之一的 Element 对象。

第十五回 DOM 元素树

在基于 DOM 树结构,我们已经掌握了什么是 DOM 节点树结构,以及节点之间的关系。在学习 Element 对象的具体用法之前,我们先来了解一下什么是元素树,以及元素之间的关系。

第十六回 定位页面元素

Document 对象的主要应用之一就是定位 HTML 页面中的元素,而 Element 对象同样提供了类似的方法用于定位 HTML 页面中指定元素内的元素。

第十七回 遍历元素

Node 对象提供的属性或方法实现了遍历节点,但实际操作中,会有空白节点问题。通过 Element 对象提供的属性或方法实现遍历元素。

第十八回 属性操作

Element 对象相对于 Node 对象更便捷地就是对属性的操作。

第十九回 innerHTML 属性

有关 Element 对象提供的属性和方法,在最后我们还需要学习一个特殊的属性,就是 innerHTML 属性。

第二十回 获取内联样式
第二十一回 获取外联样式
第二十二回 获取 class 属性
第二十三回 获取当前有效样式
第二十四回 设置内联样式
第二十五回 设置 class 属性
第二十六回 Element 对象的样式属性

本系列教程的部分内容,参考了 Mozilla 社区提供的内容,感谢开源力量。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/87186.html

相关文章

  • EASYDOM系列教程】之 innerHTML 属性

    摘要:对象提供了属性用于实现获取或设置页面指定元素的代码。需要说明的是,在上述语法结构中,调用属性的表示元素节点。但需要注明作者及来源,并且不能用于商业。本教程采用知识共享署名非商业性使用禁止演绎国际许可协议进行许可。 Element 对象提供了 innerHTML 属性用于实现获取或设置 HTML 页面指定元素的 HTML 代码。 获取 HTML 代码 innerHTML 属性表示 HTM...

    刘福 评论0 收藏0
  • EASYDOM系列教程】之 Element 对象

    摘要:而标准规范中提供了对象,主要是依靠元素树结构访问和更新页面的内容。值得注意的是所有的页面的元素都是对象,而这个对象又是继承于对象的。我们可以简单地理解对象是对象的补充。本教程采用知识共享署名非商业性使用禁止演绎国际许可协议进行许可。 DOM 的标准规范中提供了 Element 对象,该对象提供了 HTML 页面中所有元素所具有的属性和方法。 我们都知道 DOM 标准规范中提供了 Nod...

    jeyhan 评论0 收藏0
  • EASYDOM系列教程】之复制节点

    摘要:也就是说,它没有父节点。如果参数设为,则不克隆它的任何子节点。为了防止一个文档中出现两个重复的元素使用方法克隆的节点在需要时应该指定另外一个与原值不同的。 Node 对象提供了 cloneNode() 方法实现 HTML 页面中节点的复制功能。其语法结构如下: var dupNode = node.cloneNode(deep); 在上述语法结构中,调用 cloneNode() 方法的...

    Panda 评论0 收藏0
  • EASYDOM系列教程】之替换节点

    摘要:参数则表示页面中被替换的节点。方法的返回值也是被替换的节点,即。如果该节点已经存在于节点树结构中的话,则它会被从原始位置删除。但需要注明作者及来源,并且不能用于商业。本教程采用知识共享署名非商业性使用禁止演绎国际许可协议进行许可。 Node 对象提供了 replaceChild() 方法实现 HTML 页面中节点的替换功能。其语法结构如下: replacedNode = parentN...

    陈江龙 评论0 收藏0
  • EASYDOM系列教程】之删除节点

    摘要:对象提供了方法实现从页面中删除指定节点。其语法结构如下在上述语法结构中,调用方法的表示参数的父节点,而参数则表示要删除的那个节点。则用于存储要删除的节点的引用,即。 Node 对象提供了 removeChild() 方法实现从 HTML 页面中删除指定节点。其语法结构如下: var oldChild = node.removeChild(child); OR element.remov...

    zzbo 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<