按HTML查找:
优点:范围可大可小,可设置条件;
包括五种方式:
1.按id查找;
2.按标签名查找:var elems = parent.getElementsByTagName('');
3.按name属性查找:要回传给服务器的元素需要name属性,专门找表单中有name属性的表单元素;---了解即可;
4.按class属性查找;
var elems = parent.getElementsByClassName('class');
强调:1.可在任意父元素上调用;2,可返回多个元素的组成的集合;3,不要求全部匹配,只要包含即可;
缺点:每次只能按一个条件查找,如果条件复杂的话,就无法一句话获得想要的元素;
5,这是重点强调的选择器,按选择器查找:用的比较多,比较犀利
   5.1 只找一个元素:var elem = parent.querySelector('selector");
   5.2 找多个元素:var elems = parent.querySelectorAll('selector');

那么如何选择这些查找工具呢?

从使用的难易程度:

1.当条件复杂时:

按选择器查找--简单;按HMTL查找--繁琐;
2.返回值:

getElementsByTagName()返回多个元素的动态集合;

什么是动态集合:不实际存储对象的属性值,每次访问,都要重新查找DOM树;

querySelectorAll()返回多个元素的非动态集合;非动态集合---实际存储对象的所有值,即使返回反复访问集合,也不会导致反复查找DOM树。
3.单次查找效率:

按HTML查找--效率高;按选择器找--效率低;

在这里,我们重点介绍下querySelector()和querySlectorAll(),这两个方法支持CSS查询。可以通过document和element类型的实例来调用他们,目前完全支持他们的浏览器有:

而querySelectorAll:

DOM查找元素的方法总结的更多相关文章

  1. PHP提高in_array查找元素的方法

    PHP提高in_array查找元素的方法<pre><?php$arr = array(); // 创建10万个元素的数组for($i=0; $i<100000; $i++){ ...

  2. DOM获取元素的方法

    DOM:document object module 文档对象模型 DOM就是描述整个html页面中节点关系的图谱,如下图. 1,通过ID,获取页面中元素的方法:(上下文必须是document) do ...

  3. DOM查找元素

    1. 查找元素5种: 1. 按id查找1个元素对象: var elem=document.getElementById("id值"); 何时使用:1. 元素必须有id 2. 精确查 ...

  4. DOM修改元素的方法总结

    今天我们要谈谈DOM元素的修改(包括修改内容,属性,样式).修改内容的方法----3种:elem.innerHTML:获取或设置元素开始标签到结束标签之间的原始HTML代码片段:elem.textCo ...

  5. Google 开发console查找元素或方法

    F12 后 在console中输入: $("#R")[0] 查找ID 为R的元素, 如需打印出元素属性值,则输入: console.dir($("#R")[0] ...

  6. iframe中 父页面和子页面查找元素的方法

    从父页面中查找iframe子页面中对象的方法:JS: document.getElementById('iframe').contentWindow //查找iframe加载的页面的window对象 ...

  7. JavaScript, DOM查找元素

    1.document.getElementById("id"); => IE8 及较低版本不区分ID的大小写 => IE7及较低版本中表单元素的name特性和ID都会被 ...

  8. JavaScript查找元素的方法

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

  9. Javascript 查找元素

    DOM定义了多种查找元素的方法,除了我们常用的getElementById(),还有getElementsByTagName()和getElementsByName().使用这几种方法方法我们可以查找 ...

随机推荐

  1. Redis Replication & Sentinel

    实践目标: Redis Replication 一主:192.168.1.104 双从:192.168.1.101 192.168.1.103 Sentinel:192.168.1.102 系统环境: ...

  2. [转]TabControl Style in WPF

    一般 我们在使用TabControl时,需要添加多个tab页,然后把不需要的tab页通过鼠标右键点击ContextMenu菜单的形式进行关闭,下面的代码是直接在tab页上面添加按钮事件,直接点击关闭按 ...

  3. angularjs中动态为audio绑定src问题总结

    先上代码 <div class="block_area block_audio" ng-show="model.url"> <audio co ...

  4. DVWA 之medium级别sql注入

    中级注入的提交方式从get请求改为post请求,可以用burp抓包注入或抓注入点 1 .  判断是否有注入 sqlmap -u "http://192.168.242.1/dvw/vulne ...

  5. 【DM642学习笔记十】DSP优化记录

    1. 处理的数据先EDMA到片内,具有更高的效率! 以YUV2RGB为例: #pragma DATA_SECTION(onchipBuf0_y,".INTPROCBUFF"); # ...

  6. 网易DMARC设置详解

    网易企业邮箱DMARC协议设置详解 发布时间:2013-09-27 尊敬的企业用户: 据统计,全球范围内被投递的钓鱼邮件每天约达到1亿封,无孔不入的钓鱼邮件.诈骗邮件,威胁着用户的信息和财产安全.网易 ...

  7. Leetcode220. Contains Duplicate III存在重复元素3

    给定一个整数数组,判断数组中是否有两个不同的索引 i 和 j,使得 nums [i] 和 nums [j] 的差的绝对值最大为 t,并且 i 和 j 之间的差的绝对值最大为 ķ. 示例 1: 输入: ...

  8. Redis 持久化之RDB和AOF详解

    一.RDB 详解 RDB 是 Redis 默认的持久化方案.在指定的时间间隔内,执行指定次数的写操作,则会将内存中的数据写入到磁盘中.即在指定目录下生成一个dump.rdb文件.Redis 重启会通过 ...

  9. MySQL双机热备份配置

    双机热备份,即能够把主数据库中所有的数据同时写到备份的数据库中,从而实现MySQL数据库的热备份. MySQL Replication是MySQL提供的一种主从备份的机制,并且整个复制备份过程是异步进 ...

  10. 获取MMSQL数据库表信息

    SELECT 表名 then d.name else '' end, 表说明 then isnull(f.value,'') else '' end, 字段序号=a.colorder, 字段名=a.n ...