DOW对象,控制HTML对象

getElementsByName()方法

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

document.getElementsByName(name)

与getElementById() 方法不同的是,通过元素的 name 属性查询元素,而不是通过 id 属性。
注意:

  1. 因为文档中的 name 属性可能不唯一,所有 getElementsByName() 方法返回的是元素的数组,而不是一个元素。
  2. 和数组类似也有length属性,可以和访问数组一样的方法来访问,从0开始。

getElementsByTagName()方法

返回带有指定标签名的节点对象的集合。返回元素的顺序是它们在文档中的顺序
语法:

document.getElementsByTagName(Tagname)

区别getElementByID,getElementsByName,getElementsByTagName

方法说明获得
getElementByld通过指定id 获得元素一个
getElementsByName通过元素名称name属性获得元素一组
getElementsByTagName通过标签名称获得元素P一组

getAttribute()方法

通过元素节点的属性名称获取属性的值。
语法:

elementNode.getAttribute(name)

setAttribute()方法

setAttribute() 方法增加一个指定名称和值的新属性,或者把一个现有的属性设定为指定的值。
语法:

elementNode.setAttribute(name,value)

节点属性

在文档对象模型 (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

访问子节点childNodes

访问选定元素节点下的所有子节点的列表,返回的值可以看作是一个数组,他具有length属性。
语法:

elementNode.childNodes

访问子节点的第一和最后项

firstChild 属性返回‘childNodes’数组的第一个子节点。如果选定的节点没有子节点,则该属性返回 NULL。
语法:

node.firstChild

lastChild 属性返回‘childNodes’数组的最后一个子节点。如果选定的节点没有子节点,则该属性返回 NULL。
语法:

node.lastChild

访问父节点parentNode

获取指定节点的父节点
语法:

elementNode.parentNode

访问兄弟节点

  1. nextSibling 属性可返回某个节点之后紧跟的节点(处于同一树层级中)。
    语法:
nodeObject.nextSibling
  1. previousSibling 属性可返回某个节点之前紧跟的节点(处于同一树层级中)。
    语法:
nodeObject.previousSibling  

插入节点appendChild()

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

appendChild(newnode)

插入节点insertBefore()

insertBefore() 方法可在已有的子节点前插入一个新的子节点。
语法:

insertBefore(newnode,node);

参数:
newnode: 要插入的新节点。

node: 指定此节点前插入节点。

我们在来看看下面代码,在指定节点前插入节点。

删除节点removeChild()

removeChild() 方法从子节点列表中删除某个节点。如删除成功,此方法可返回被删除的节点,如失败,则返回 NULL。
语法:

nodeObject.removeChild(node)

替换元素节点replaceChild()

replaceChild 实现子节点(对象)的替换。返回被替换对象的引用。
语法:

node.replaceChild (newnode,oldnew ) 

创建元素节点createElement

createElement()方法可创建元素节点。此方法可返回一个 Element 对象。
语法:

document.createElement(tagName)

创建文本节点createTextNode

createTextNode() 方法创建新的文本节点,返回新创建的 Text 节点。
语法:

document.createTextNode(data)
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Beiyux

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值