关于getElementsByTagName的遍历顺序是怎么样的呢？

getElementsByTagName的遍历顺序是从HTML的页面从上到下遍历还是按照标签的嵌套顺序层层遍历的呢？

来做个小小的测试？

看代码！

<body>

    <div>

        <div>

            <p>2</p>

            <div>

                <p>4</p>

                <div>

                    <p>6</p>

                </div>

                <p>5</p>

            </div>

            <p>3</p>

        </div>

        <p>1</p>

    </div>

    <p>0</p>

    <script type="text/javascript">

        var op = document.getElementsByTagName("p");

        op[0].style.backgroundColor="red";

    </script>

</body>

如果getElementsByTagName的遍历顺序是按照标签的嵌套来遍历的，那么上面的代码运行的结果应该是 0对应那一行背景颜色会变成红色，

真实情况如图：

<p>0</p>位于HTML页面的最下层，所以如果想改变 0 的背景颜色应

结果如下：

可见getElementsByTagName的遍历顺序是从上到下！

　　

关于getElementsByTagName的遍历顺序的更多相关文章

  1. (转)深入理解PHP之数组(遍历顺序)

    深入理解PHP之数组(遍历顺序)(转) http://www.laruence.com/2009/08/23/1065.html (鸟哥) 经常会有人问我, PHP的数组, 如果用foreach来访问 ...

  2. json对象遍历顺序问题

    对json对象遍历我们一般使用for in循环,或者Object.keys + 数组方法.在接触js以来听到过一种说法: for in 遍历顺序是不可靠的 但是在实际开发中for in 循环也是按照其 ...

  3. PHP内核深入研究 - 数组及其遍历顺序

    事实上,广义上来讲,PHP就是C语言应用在Web上的一个模板,PHP中smarty模板用得比较多,就好比JSP是Java Servlet的模板一样(喔,对了,JSP中有个JSTL标签),复杂的模板语法 ...

  4. PHP之数组(遍历顺序)

    作者: Laruence(   ) 本文地址: http://www.laruence.com/2009/08/23/1065.html PHP的数组, 如果用foreach来访问, 遍历的顺序是固定 ...

  5. Codeforces 509F Progress Monitoring：区间dp【根据遍历顺序求树的方案数】

    题目链接:http://codeforces.com/problemset/problem/509/F 题意: 告诉你遍历一棵树的方法,以及遍历节点的顺序a[i],长度为n. 问你这棵树有多少种可能的 ...

  6. 深入理解PHP之数组(遍历顺序)

    作者: Laruence 本文地址: http://www.laruence.com/2009/08/23/1065.html 转载请注明出处 经常会有人问我, PHP的数组, 如果用foreach来 ...

  7. js-for (var in )遍历顺序乱了

    存放的key 为如下: “01”,“02”,“03”,········“10”,“11”,“12” 遍历之后“10”,“11”,“12”, “01”,“02”,“03”,········ 解决办法:把 ...

  8. ECMAScript5之JSON对象属性的遍历顺序

    测试浏览器 Chrome.Safari 一 键可以用parseInt解析成整数的,按数值升序顺序. var intObj = { '3.3' : 3.3, '2' : 222, '1' :111 } ...

  9. 树的遍历顺序 - dfs序|欧拉序|dfn序（备忘）

    (仅作备忘) dfs序是dfs过程中对于某节点进入这个节点的子树和离开子树的顺序 满足每个节点都会在dfs序上出现恰好两次 任意子树的dfs序都是连续的 欧拉序是dfs过程中经过节点的顺序 每个节点至 ...

随机推荐

  1. JDBCUtils 工具类

    import com.alibaba.druid.pool.DruidDataSourceFactory; import javax.sql.DataSource;import java.io.IOE ...

  2. javascript面向对象中继承实现的几种方式

    1.原型链继承: function teacher(name){ this.name = name; } teacher.prototype.sayName = function(){ alert(t ...

  3. Java常用工具类---XML工具类、数据验证工具类

    package com.jarvis.base.util; import java.io.File;import java.io.FileWriter;import java.io.IOExcepti ...

  4. MySQL数据表查询操

    准语法结构:编写DQL时一定要严格按照此语法的顺序来实现!/* SELECT [ALL | DISTINCT] ALL表示查询出所有的内容 DISTINCT 去重 {* | 表名.* | 表名.字段名 ...

  5. Vue2实例中的data属性三种写法与作用

    <script src="https://unpkg.com/vue/dist/vue.js"></script> <div id="app ...

  6. selenium工作原理

    在我们new一个webdriver过程中 selenium会检测本地浏览器组件是否存在,版本是否匹配,接着会启动一套webservice ,这套webservice使用的selenium定义的webw ...

  7. 40 最小的K个数（时间效率）

    题目描述: 输入n个整数,找出其中最小的K个数.例如输入4,5,1,6,2,7,3,8这8个数字,则最小的4个数字是1,2,3,4,.   测试用例: 功能测试(输入的数组中有相同的数字:输入的数组中 ...

  8. 训练1-W

    有一个长度为n(n<=100)的数列,该数列定义为从2开始的递增有序偶数,现在要求你按照顺序每m个数求出一个平均值,如果最后不足m个,则以实际数量求平均值.编程输出该平均值序列. Input 输 ...

  9. POJ 2376 Cleaning Shifts (线段树优化DP)

    题目大意:给你很多条线段,开头结尾是$[l,r]$,让你覆盖整个区间$[1,T]$,求最少的线段数 题目传送门 线段树优化$DP$裸题.. 先去掉所有能被其他线段包含的线段,这种线段一定不在最优解里 ...

  10. [luogu4310] 绝世好题 (递推)

    传送门 题目描述 给定一个长度为n的数列ai,求ai的子序列bi的最长长度,满足bi&bi-1!=0(2<=i<=len). 输入输出格式 输入格式: 输入文件共2行. 第一行包括 ...