JavaScript查找节点



整个文档的节点就是document节点,那么想要具体找到某个节点,我们可以使用document提供的一系列方法:

图片发自简书App

getElementsByTagName()返回所有指定HTML标签的元素,返回值是一个类似数组的HTMLCollection对象;匹配失败,返回[]参数是想要获取节点的具体节点名称,就是标签名;

图片发自简书App

getElementsByClassName()返回所有class名字符合指定条件的元素,返回值是一个类似数组的HTMLCollection对象;匹配失败,返回[]参数为标签的class属性的值

图片发自简书App

getElementsByName()选择拥有name属性的HTML元素,返回值是一个类似数组的HTMLCollection对象;匹配失败,返回[]参数为标签的name属性的值;注意,使用时,最好选择原生具有name属性的元素;

图片发自简书App

getElementById()返回匹配指定id属性的元素节点;没有发现匹配的节点,则返回null参数为标签的id属性的值,参数大小写敏感;

图片发自简书App

querySelector()、querySelectorAll()document.querySelector方法接受一个CSS选择器作为参数,返回匹配该

选择器的元素节点;如果有多个节点满足匹配条件,则返回第一个匹配的节点。如果没有发现匹配的节点,则返回

null;

document.querySelectorAll方法与querySelector用法类似,区别是返回一个类似数组的HTMLCollection对象,

包含所有匹配给定选择器的节点。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第3章 基本概念 3.1 语法 3.2 关键字和保留字 3.3 变量 3.4 数据类型 5种简单数据类型:Unde...
    RickCole阅读 5,156评论 0 21
  • 概述 document节点是文档的根节点,每张网页都有自己的document节点。window.document属...
    许先生__阅读 666评论 0 2
  •   DOM(文档对象模型)是针对 HTML 和 XML 文档的一个 API(应用程序编程接口)。   DOM 描绘...
    霜天晓阅读 3,690评论 0 7
  • 一、概述 document节点是整个文档树的顶层节点,每张网页都有自己的document节点。window.doc...
    周花花啊阅读 1,351评论 0 1
  • 前言:尽管现在有很多优秀的框架,大大简化了我们的DOM操作,但是我们仍然要学好DOM知识来写原生JS,从根本上去理...
    长鲸向南阅读 1,915评论 0 0