首页 > 编程 > HTML > 正文

了解NodeList、HTMLCollection以及NamedNodeMap的使用(代码)

2020-03-24 18:02:42
字体:
来源:转载
供稿:网友
首页 > web前端 > html教程 > 正文 了解NodeList、HTMLCollection以及NamedNodeMap的使用(代码) 2018-10-17 14:53:48 第六期线上培训班

本篇文章给大家带来的内容是关于了解NodeList、HTMLCollection以及NamedNodeMap的使用(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

这三个都是类数组对象。

HTMLCollection只包含元素节点,而NodeList包含任何节点类型。

HTMLCollection对象可以调用item()和namedItem()方法,NodeList对象只能调用item()方法。在获取元素时,两者都可以通过方括号的语法或item()方法。HTMLCollection对象允许通过namedItem()方法,传入一个name或id获取元素。

一些旧版本浏览器中的方法(如:getElementsByClassName())返回的是 NodeList 对象,而不是 HTMLCollection 对象。所有浏览器的 childNodes 属性返回的是 NodeList 对象。大部分浏览器的 querySelectorAll() 返回 NodeList 对象。getElementsByTagName()返回HTMLCollection对象。

NamedNodeMap对象是通过node.attributes属性获取,获取到由该元素的所有属性构成的伪数组对象。

例:

 body  a href= # id= a1 1 /a  a href= a.html name= a2 2 /a  /body  script  // 获取一个HTMLCollection对象 var res = document.getElementsByTagName( a  console.log(res); console.log(res.item(0)) console.log(res[0]) console.log(res.namedItem( a1 )) console.log(res.namedItem( a2 )) // 结果如下图所示: /script 

1.png

以上就是对了解NodeList、HTMLCollection以及NamedNodeMap的使用(代码)的全部介绍,如果您想了解更多有关HTML视频教程,请关注PHP 。

以上就是了解NodeList、HTMLCollection以及NamedNodeMap的使用(代码)的详细内容,html教程

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表