DOM启蒙：文档节点

最新推荐文章于 2022-11-26 20:09:37 发布
最新推荐文章于 2022-11-26 20:09:37 发布
阅读量209 收藏
点赞数
分类专栏： DOM启蒙 前端 DOM启蒙 文章标签： DOM JavaScript 读书笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/rachel9798/article/details/83346689
版权
前端 同时被 3 个专栏收录
9 篇文章 0 订阅
订阅专栏
DOM启蒙
8 篇文章 0 订阅
订阅专栏
DOM启蒙
8 篇文章 0 订阅
订阅专栏

1.文档节点概览

     HTMLDocument构造函数在DOM中创建DOCUMENT_NODE。

     Document与HTMLDocument构造函数是浏览器在加载HTML文档时特意实例化的。

     document.implementation.createHTMLDocument():可以在浏览器中当前加载的文档之外创建一个自己的HTML文档。

     createElement（）:创建一个尚未成为HTML文档的文档对象。

2.HTML文档属性与方法（包括继承的）

   属性：

  • doctype：指向<!DOCTYPE>
  • documentElement：指向<html lang="en">
  • head：指向<head>
  • body：指向<body>
  • title：可获取HTML Document的标题
  • URL：可获取HTML Document的链接
  • referrer：可获取HTML Document的提及者
  • lastModified：可获取HTML Document的最后修改时间
  • compatMode：可获取HTML Document的兼容模式
  • activeElement：可获取当前聚焦/激活节点的引用
  • ownerDocument：可从某一元素取得文档的引用
  • defaultView：是一个到JavaScript顶部对象的捷径

   方法：

  • document.implementation.hasFeature(feature，version)：探测DOM规范/特性
  • document.hasFocus()：判断文档或文档中任何节点得到焦点

3.其他

  • document节点可以包含一个DocumentType节点对象和一个Element节点对象。
  • window.document是DOM接口的起始。
  • 区分DOCUMENT_TYPE_NODE与DOCUMENT_NODE
  • 使用isSupported（）方法，可以获取某一个特定节点的实现程度信息。例如element.isSupported(feature,version)
  • element.focus()：聚焦于某一节点
  •  
yyanliqi
关注
专栏目录
element plus - 报错Uncaught DOMException: Failed to execute ‘querySelectorAll‘ on ‘Element‘: ‘x‘ is no
高级前端工程师
06-01 3464
vue3，element-plus，虚拟表格，querySelectorAll，鼠标移入表格就报错，鼠标放到表格上就会一堆报错，elementPlus虚拟化表格报错警告解决，el-table-v2，如何解决虚拟化表格警告，element plus虚拟化表格组件， [Vue warn]: Unhandled error during execution of native event handler，Uncaught DOMException: Failed to execute 'querySelector
javascript将DOM节点添加到文档的方法实例分析
10-23
在JavaScript中，将DOM节点添加到文档是一项基础且重要的操作。本文将介绍如何通过JavaScript将DOM节点添加到文档，并且通过实例分析不同的方法及其性能表现。 首先，我们来了解一下什么是DOM。DOM是文档对象模型...
DOM启蒙JPG版
12-27
自制图像版，去除目录等无用页面，给想深入原始API的人看，不被各种框架掩盖实质。
《DOM启蒙》 随笔
weixin_33807284的博客
12-26 96
使用 Javascript 字符串创建并向 DOM 中添加元素与文本节点 innerHTML、outerHTML、textContent 及 insertAdjacentHTML() 属性和方法提供了使用 Javascript 字符串创建并向 DOM 中添加节点的功能。 &lt;!DOCTYPE html&gt; &lt;html lang='en'&gt; &lt;body&gt; ...
JavaScript DOM总结（文档节点）
鹿蹊zz的博客
07-08 491
当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model，简称DOM）HTML DOM 模型被结构化为 对象树 。DOM树又称为文档树模型，把文档映射成树形结构，通过节点对象对其处理，处理的结果可以加入到当前的页面。正在上传…重新上传取消DOM是W3C组织制定的一套处理 html和xml文档的规范。所有的浏览器都遵循了这套标准。通过这个对象模型，JavaScript 获得创建动态 HTML 的所有力量：换言之：HTML DOM 是关于如何获取、更改、添加或删除 HTML 元
DOM中nodeType的值说明
牛牛的小窝
03-09 1821
HTML文档的节点DOM下，HTML文档各个节点被视为各种类型的Node对象。每个Node对象都有自己的属性和方法，利用这些属性和方法可以遍历整个文档树。由于HTML文档的复杂性，DOM定义了nodeType来表示节点的类型。这里列出Node常用的几种节点类型：接口 nodeType常量 nodeType值 备注 Element Node.ELEMENT_NODE 1 元素节点 Text Node
HTML文档的节点
小爬爬的专栏
07-23 974
<br />DOM下，HTML文档各个节点被视为各种类型的Node对象。每个Node对象都有自己的属性和方法，利用这些属性和方法可以遍历整个文档树。由于HTML文档的复杂性，DOM定义了nodeType来表示节点的类型。这里列出Node常用的几种节点类型：接口nodeType常量nodeType值备注ElementNode.ELEMENT_NODE1元素节点TextNode.TEXT_NODE3文本节点DocumentNode.DOCUMENT_NODE9documentCommentNode.COMMEN
jacascript DOM节点——元素节点、属性节点、文本节点
08-30
DOM节点是这个树形结构的基本单位，主要包括元素节点、属性节点和文本节点。 **元素节点** 是DOM中最核心的部分，它们对应HTML中的标签元素。例如，`<div>`、`<p>`、`<img>`等都是元素节点。元素节点提供了访问标签...
dom:用于处理 DOM 文档的节点服务
06-27
使用 xpath 处理 DOM 文档的节点服务。 使用正确的 Content-Type 标头和包含 xpath 的查询参数发布您的文档。 用法： curl -X POST -d @web-page.html -H 'Content-Type: text/html' ' ' 这将使用文档包含的锚...
dom-serializer：渲染dom节点
02-09
5. **性能优化**：由于其核心功能是处理DOM，因此`dom-serializer` 在设计上注重性能，能够高效地遍历和处理大量DOM节点，尤其适用于大型网页或复杂文档的处理。 在实际应用中，例如，你可以用`dom-serializer` 来...
DOM启蒙——第一章
Wendelle的博客
04-07 1160
1.文档对象模型 HTML文档被浏览器解析并转换为一个由节点对象组成以体现当前文档的树状结构，DOM的目的是使用JavaScript操作为当前的文档提供一个编程接口。 2.节点对象类型 ●DOCUMENT_NODE (如window.document) ●ELEMENT_NODE如(、、...) ●ATTRIBUTE_NODE(如class="color") ●TEXT_N
DOM简介、HelloWorld、文档节点、获取元素节点、元素的属性和方法——DOM
最新发布
weixin_70320000的博客
11-26 2459
DOM简介、HelloWorld、文档节点、获取元素节点、元素的属性和方法
JS_DOM文档对象模型（节点篇）
weixin_57762552的博客
03-20 316
想要知道什么是节点，首先要知道什么是DOM，DOM全称Document Object Model文档对象模型，JS中通过DOM来对HTML文档进行操作。 文档对象模型可以拆开三份进行理解，文档表示的就是整个HTML网页文档、对象表示的是将网页中的每一个部分都转换为了一个对象、模型表示的是使用模型来表示对象之间的关系。 在文档对象模型中最重要的就是“节点”，节点(Node)是构成网页的最基本的组成部分也是构成HTML文档最基本的单元。在网页中的每一个部分都可以称为是一个节点，比如：html标签、属
DOM启蒙——第二章
Wendelle的博客
04-11 510
1.文档节点 HTMLDocument构造函数在DOM中创建DOCUMENT_NODE(如window.document)。 alert(window.document.constructor);//function HTMLDocument() alert(window.document.nodeType);//DOCUMENT_NODE  9 即HTMLDocument构造函数
DOM启蒙：DocumentFragment节点
里脊的博客
10-30 264
1.DocumentFragment对象概览      把DocumentFragment看做一个空的文档模板，行为与实时DOM树相仿，但仅在内存中存在，并且它的子节点可以很简单地在内存中操作，而后附加到实时DOM。   2. createDocumentFragment()：             创建DocumentFragment             使用文档片段在内存中创建...
DOM启蒙——第六章
Wendelle的博客
04-21 518
1.文本对象概览 HTML文档中的文本表现为Text()构造函数的实例。即文本节点。 var text=document.querySelector("#txt").firstChild; P.appendChild(document.createTextNode(text.constructor));//Text() Text()构造函数构造文本节点，Text从ChracterD
DOM启蒙——第五章
Wendelle的博客
04-16 396
1.CSSOM视图模块中规范了操作元素节点的可视化表象的API。 2.获取元素相对于offsetParent的offsetTop及offsetLeft值 使用offsetTop和offsetLeft属性可以获取元素节点相对于offsetParent的偏移像素量，这些元素节点属性告诉我们某元素上部与左侧边框最外沿到offsetParent上部与左侧边框内侧的距离，以像素为单位。 ●of
DOM启蒙——第11章
Wendelle的博客
05-22 570
1.DOM事件概览 ●DOM事件是指发生某种与DOM中元素、document对象或window对象有关的时刻或者契机。 ●可以通过HTML内联属性事件处理程序，属性事件处理程序，或者addEventListener()方法布置事件回调。 var div=document.querySelector("#warp"); //属性事件处理程序 div.onclick=function()
DOM启蒙——第四章
Wendelle的博客
04-13 553
1.选取特定元素节点 取得一个元素节点引用的最常用的方式为 ●querySelector() ●getElementById() querySelector()返回文档中符合传入选择器的首个元素节点，即若有多个节点满足条件，则返回第一个。 document.createTextNode(document.querySelector("li").textContent) do
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值