JavaScript——DOM

DOM:文档对象模型,定义访问和处理html文档的标准方法。

DOM节点有:

元素节点:<html> <body>之类的都是

文本节点:向用户展示内容,如<li>…</li>中的JavaScript、DOM、CSS等

属性节点:元素属性,如<a>标签内的链接属性href="http://www.baidu.com"

节点属性:

方法

说明

nodeName

返回一个字符串, 其内容是给定节点的名字

nodeTypee

返回一个整数,这个数值代表给定节点的类型。

nodeValue

返回给定节点的当前值

遍历节点数:

方法

说明

chilidNodese

返回一 个数组,这个数组由给定元素节点的子节点构成

firstChilde

返回第-个子节点

lastChilde

返回最后一个子节点

parentNodee

返回一个给定节点的父节点

nextsiblinge

返回给定节点的下一一个子节点

preioussiblinge

返回给定节点的上一一个子节点

DOM操作

方法

说明

createElementelement()

创建一个新的元素节点

createTextNodepe

创建一个包含着给定文本的新文本节点。

appendChild

指定节点的最后一个子节点列表之后添加一个新的

insertBetore()

将一个给定节点插入到一个給定元素节点的给定子节点

removechild()

从个给定元素中册除个子节点

replaceChild()

把一个给定父元素里的一个子节点替换为另外一个

返回带有指定名称的节点对象的集合:

document.getElementsByName(name)

注意:

1. 因为文档中的 name 属性可能不唯一,所有 getElementsByName() 方法返回的是元素的数组,而不是一个元素。

2. 和数组类似也有length属性,可以和访问数组一样的方法来访问,从0开始。

返回带有指定标签名的节点对象集合:

document.getElementsByTagName(Tagname)

区别:

方法

说明

获得

getElementByld

通过指定 id获得元素

一个

getElementsByName

通过元素名称name属性获得元素。

一组

getelmentsByTagName

通过标签 名称获得元素

一组

 

getAttribute()方法:

elementNode.getAttribute(name)

在文档对象模型 (DOM) 中,每个节点都是一个对象。DOM 节点有三个重要的属性 :

 1. nodeName : 节点的名称

 

2. nodeValue :节点的值

3. nodeType :节点的类型

一、nodeName 属性: 节点的名称,是只读的。

1. 元素节点的 nodeName 与标签名相同

2. 属性节点的 nodeName 是属性的名称

3. 文本节点的 nodeName 永远是 #text

4. 文档节点的 nodeName 永远是 #document

二、nodeValue 属性:节点的值

1. 元素节点的 nodeValue 是 undefined 或 null

2. 文本节点的 nodeValue 是文本自身

3. 属性节点的 nodeValue 是属性的值

三、nodeType 属性: 节点的类型,是只读的。以下常用的几种结点类型:

元素类型    节点类型

  元素          1

  属性          2

  文本          3

  注释          8

  文档          9

posted @ 2019-08-16 15:05  Sean_Martin  阅读(...)  评论(...编辑  收藏