JavaScript之DOM

最新推荐文章于 2022-08-29 21:07:38 发布

CSDN认证用户

最新推荐文章于 2022-08-29 21:07:38 发布

阅读量179

点赞数 1

分类专栏： JavaScript 前端学习JavaScript 文章标签： javascript

本文链接：https://blog.csdn.net/Helloyongwei/article/details/80168276

版权

77 篇文章 0 订阅

订阅专栏

38 篇文章 0 订阅

订阅专栏

32 篇文章 3 订阅

订阅专栏

本文根据(JavaScript高级程序设计(第三版))整理笔记

Node类型

节点有nodeName和nodeValue属性, 表示节点名和节点值. 对于元素节点, nodeName返回元素的标签名, nodeValue返回null.
节点的childNodes属性返回节点的子节点, 它是一个NodeList类数组对象(动态), 可以通过方括号和item(index)方法取得子节点
每个节点有个parentNode属性, 指向它的父节点
节点的previousSibling和nextSibling属性分别返回节点的上一兄弟节点和下一兄弟节点.
节点的firstChild返回节点的第一个子节点, lastChild返回节点的最后一个子节点
+ hasChildNodes()方法返回true/false, 当节点有子节点时, 返回true

JavaScript中Document表示文档, 浏览器中document为HTMLDocument的实例. HTMLDocument继承自Document.
document同时也是window的一个属性.
nodeType = 9
nodeName ="#document"
nodeValue = null
parentNode = null
document.documentElement指向<html>元素
document.body指向<body>元素
document.doctype指向<DOCTYPE>
document.title指向<title>
document.URL指向网页的URL
document.domain返回域名
document.referrer返回来源页的URL
document.getElementById()通过Id返回元素
document.getElementsByTagName()通过标签名返回元素集合, 它是HTMLCollection对象. 这个对象有一个namedItem方法, 也可以调用item()方法

document还有一些属性集合也为HTMLCollection对象

document.anchors返回所有带有name属性的<a>元素
document.forms返回文档中所有的<form>元素
document.images返回所有的<img>元素
document.links 返回带有href属性的<a>元素
可以通过document.implementation检测DOM实现的功能, 他有一个hasFeature()方法
通过document.write(), document.writeln(), document.open()和document.close()方法向文档写入信息.

nodeType = 1
nodeName为标签名
nodeValue = null
parentNode = Document或者Element
nodeName 和tagName返回相同的值
HTML元素有以下的标准特性:
id: 元素在文档中的唯一标识
title: 对元素的说明
lang: 元素内容的语言代码
dir: 语言方向. ltr为从左至右, rtl为从右至左
className: 对应元素的class属性
getAttribute()获取元素的属性
setAttribute()设置元素的属性
removeAttribute()删除属性
可以对Element类型的值使用attributes属性, 它包含一个NamedNodeMap(动态)对象, 有如下方法:
getNamedItem(name)返回nodeName为name的节点
removeNamedItem(name)从列表中移除nodeName为name的节点
setNamedItem(node)向列表中添加节点, 以节点的nodeName为索引
item(pos)返回pos索引处的节点
我们还可以通过document.createElement()创建新元素

nodeType = 3
nodeName = "#text"
nodeValue为节点所包含的文本
parentNode为Element
Text类型的data属性等同于nodeValue, 以下方法可以操作节点的文本:
appendData(text): 将text添加到节点末尾
deleteData(offset, count)从offset指定的位置开始删除count个字符
insertData(offset, text)在offset指定的位置插入text
replaceData(offset, count, text)用text替换从offset指定的位置开始到offset+count为止处的字符串
splitText(offset)从offset指定的位置将当前文本节点分成两个文本节点
subsringData(offset, count)提取从offset指定的位置开始到offset+count为止处的字符串
文本节点还有一个length属性, 保存着节点中字符的数目.
默认情况下, 每个可以包含内容的元素最多只能有一个文本节点, 而且必须确实有内容存在.

这个节点类型表示的是文档中的注释

它表示文档片段

关注

专栏目录