总结获取元素的方式

1. 根据id属性的值获取元素,返回来的是一个元素对象
document.getElementById("id属性的值");
document.getElementById("btn");
2. 根据标签名字获取元素,返回来的是一个伪数组,里面保存了多个的DOM对象
document.getElementsByTagName("标签名字");
document.getElementsByTagName("li");
下面的几个,有的浏览器不支持
 
3. 根据name属性的值获取元素,返回来的是一个伪数组,里面保存了多个的DOM对象
document.getElementsByName("name属性的值")
document.getElementsByName("name1")
4. 根据类样式的名字来获取元素,返回来的是一个伪数组,里面保存了多个的DOM对象
document.getElementsByClassName("类样式的名字")
document.getElementsByClassName("cls")
5. 根据选择器获取元素,返回来的是一个元素对象
document.querySelector("选择器的名字");
document.querySelector("#btn"); //id,类,标签等选择器用的比较多
6. 根据选择器获取元素,返回来的是一个伪数组,里面保存了多个的DOM对象
document.querySelectorAll("选择器的名字")
 
 

JS---DOM---总结获取元素的方式的更多相关文章

  1. 原生JS与JQ获取元素的区别

    刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...

  2. 从零开始学 Web 之 DOM(二)对样式的操作,获取元素的方式

    大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程.此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注.在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识 ...

  3. Appium获取元素的方式

    1.apk包名和launcherActivity 1.1.获取包名 所有应用包名列表 adb shell pm list packages 第三方应用包名列表 adb shell pm list pa ...

  4. DOM——获取元素的方式

    document.getElementById("id属性的值"): //可以通过元素的 id 来获取元素,返回的是一个元素对象 document.getElementByName ...

  5. App自动化之dom结构和元素定位方式(包含滑动列表定位)

    900×383 38 KB 先来看几个名词和解释: dom: Document Object Model 文档对象模型 dom应用: 最早应用于html和js的交互.界面的结构化描述, 常见的格式为h ...

  6. JavaScript中几种 获取元素的方式

    1.根据id获取元素 document.getElementById("id属性的值"); 2.根据标签名字获取元素 document.getElementsByTagName(& ...

  7. JavaScript的DOM操作获取元素实际大小

    clientWidth 和 clientHeight 这组属性可以获取元素可视区的大小,可以得到元素内容及内边距所占据的空间大小. 返回了元素大小,但没有单位,默认单位是 px,如果你强行设置了单位, ...

  8. 原生js来写获取元素距离顶部距离,以及滚动条滚动指定距离和时间控制

    这是我在写vue项目里封装的一个公共js类 里面还有一些其他的方法,一并拿过来了 class Public { isDesktop(){ //判断是否为pc端 return (window.scree ...

  9. javascript的DOM操作获取元素

    一.document.getElementById()    根据Id获取元素节点 <div id="div1"> <p id="p1"> ...

随机推荐

  1. 目不识丁的我使用Python编写汉字注音小工具

    一万点暴击伤害 人懒起来太可怕了,放了个十一充分激发了我的惰性.然后公众号就这么停了半个月,好惭愧- 新学期儿子的幼儿园上线了APP,每天作业通过app布置后,家长需要陪着孩子学习,并上传视频才算完成 ...

  2. JAVA学习第一课-手工笔记

    JVM:JAVA虚拟机,JAVA核心,跨平台,作用是翻译. JRE:运行环境,包含JVM和运行的核心类库. JDK:全新开发使用,包含JRE,编译工具: 核心是JVM 以下是关系库 安装路径不要有空格 ...

  3. 简而意赅 HTTP HTTPS SSL TLS 之间有什么不同

    HTTP HTTPS SSL TLS 之间有什么不同? SSL是Secure Sockets Layer的缩写.SSL的作用是为网络上的两台机器或设备提供了一个安全的通道. TLS是SSL的一个新的名 ...

  4. 前端跨域 nginx 反向代理

    1.下载ngnix稳定版   (http://nginx.org/en/download.html) 2.解压到你中意的目录. 3.将你的网页文件放到刚解压html文件目录下 4.打开conf  &g ...

  5. js 实现 多层级对象合并

    js 实现 多层级对象合并 首先 需求是使用js对数据的格式进行转换 把一个二维数组(包含层级信息,层级数是不固定的)list 转换为多层级的对象 我的思路就是 循环先把list里单条信息转换为 多层 ...

  6. go-channel处理高并发请求

    目录 go-channel处理高并发请求 一.Channel简介 二.处理包并发请求 三.测试 1.测试工具 2.测试结果 go-channel处理高并发请求 最近看了一篇文章讲解怎样使用go-cha ...

  7. 简单高效的端口扫描python脚本

    欢迎python爱好者加入:学习交流群 667279387 最近为了获取虚拟机端口开放情况,写了一个简单脚本来查看.共享给大家.下面的代码在python2种测试通过 说明:concurrent是pyt ...

  8. 第6节:Java基础 - 三大集合(上)

    第6节:Java基础 - 三大集合(上) 本小节是Java基础篇章的第四小节,主要介绍Java中的常用集合知识点,涉及到的内容包括Java中的三大集合的引出,以及HashMap,Hashtable和C ...

  9. HDU5470 Typewriter (SAM+单调队列优化DP)

    Typewriter Time Limit: 6000/3000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others)Tota ...

  10. HDU5919 Sequence II(主席树)

    Mr. Frog has an integer sequence of length n, which can be denoted as a1,a2,⋯,ana1,a2,⋯,anThere are ...