摘要:就是大家一起出来的页面的一种结构。由个部分组成,。就是写代码的那些标签组成的,如下图就是把转换成对象得到的,关系如下图。对节点进行操作意思就是在这颗树上爬来爬去,寻找需要的元素文本文档等,进行删增改查。
DOM
DOM就是大家一起YY出来的页面的一种结构。由3个部分组成,Document,Object,Model。
Document就是写代码的那些标签组成的,如下图:
Object就是把Document转换成对象得到的,关系如下图。Javascript类型中,它们都属于Node,Node又属于Object,关系如下下图:
Model就是上面这样模式的名字,文档对象模型。
Node正如像function,Array一样,Node也有很多自己的方法和属性。Array的方法和属性用来对数组进行操作,Node的方法和属性就用来对节点进行操作。对节点进行操作意思就是在DOM这颗树上爬来爬去,寻找需要的元素(element),文本(text),文档(document)等,进行【删增改查】。
Node主要属性 父节点和子节点parentElement
parentNode
childNodes
获得目标元素的所有子节点,这是对代码来讲的,所以也包括了写代码时的回车换行(text节点)
children
获得目标元素的所有子标签
firstChild
获得目标元素第一个子节点
firstElementChild
获得目标元素第一个子标签
lastChild
获得目标元素最后一个子节点
lastElementChild
获得目标元素最后一个子标签获取文本
innerText
修改节点的innerText,会删除节点里面的所有内容,改为修改的值
要在后面添加文本内容,请这样写: var textnode=document.createTextNode("helloMyLove"); //创建文本节点 xxx.appendChild(textnode); //添加文本节点 或者联成一句: xxx.appendChild(document.createTextNode("helloMyLove");
textContext
请参考: https://developer.mozilla.org/zh-CN/docs/Web/API/Node/textContent
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/52659.html
摘要:它是轻量级的,与特定于浏览器的实现细节分离。由于本身已经是抽象,因此虚拟实际上是抽象的抽象。它允许在这个抽象的世界中进行计算,并跳过真正的那些缓慢的操作。 前言 目前主流的前端框架React和Vue中都用到了Virtual DOM这个技术,而Virtual DOM到底是什么,可能很多人和我一样,概念上还是模糊。本文主要介绍DOM和Virtual DOM的基本概念及个人理解。 以下的D...
摘要:它是轻量级的,与特定于浏览器的实现细节分离。由于本身已经是抽象,因此虚拟实际上是抽象的抽象。它允许在这个抽象的世界中进行计算,并跳过真正的那些缓慢的操作。 前言 目前主流的前端框架React和Vue中都用到了Virtual DOM这个技术,而Virtual DOM到底是什么,可能很多人和我一样,概念上还是模糊。本文主要介绍DOM和Virtual DOM的基本概念及个人理解。 以下的D...
摘要:为此也做了一些学习简单的侃一侃虚拟到底是什么虚拟详解二什么是虚拟虚拟首次产生是框架最先提出和使用的,其卓越的性能很快得到广大开发者的认可,继之后也在其核心引入了虚拟的概念。所谓的虚拟到底是什么也就是通过语言来描述一段代码。 随着Vue和React的风声水起,伴随着诸多框架的成长,虚拟DOM渐渐成了我们经常议论和讨论的话题。什么是虚拟DOM,虚拟DOM是如何渲染的,那么Vue的虚拟Dom...
阅读 3664·2021-11-11 10:58
阅读 2409·2021-09-22 15:43
阅读 2839·2019-08-30 15:44
阅读 2147·2019-08-30 13:08
阅读 1802·2019-08-29 17:28
阅读 842·2019-08-29 10:54
阅读 592·2019-08-26 11:46
阅读 3477·2019-08-26 11:43