zoukankan      html  css  js  c++  java
  • 关于 XX.getElementsByTagName('*')的困扰和解决办法

    在学习Javascript的dom阶段,为了加深对节点的理解,方便日后使用,封装了一下获得classname函数,具体如下:

     1    <script>
     2         function getByClass(Parent, sClass) {
     3             var aEle = Parent.getElementsByTagName('*');
     4             var aReturn = [];
     5             for (var i = 0; i < aEle.length; i++) {
     6                 if (aEle[i].className == sClass) {
     7                     aReturn.push(aEle[i]);
     8                 }
     9             }
    10             return aReturn;
    11         };
    12         window.onload = function () {
    13             var aUl = document.getElementsByTagName('ul');
    14             var aLi = getByClass(aUl, 'box');
    15             alert(aLi.length);
    16             for (var i = 0; i < aLi.length; i++) {
    17                 aLi[i].style.background = 'red';
    18             }
    19         };
    20     </script>
    21 </head>
    22 
    23 <body>
    24     <ul>
    25         <li class="box">1</li>
    26         <li class="box">1</li>
    27         <li></li>
    28         <li></li>
    29         <li class="box">1</li>
    30     </ul>
    31 </body>

    发现第三行始终报错:Uncaught TypeError: Parent.getElementsByTagName is not a function

    多方测试,发现所有元素获取都正常,形参Parent得到的也是aUl,在网上搜索解决办法也迟迟未果,我便开始了如下尝试:

    首先我判断应该是Parent处出现了问题,那么我在13行下加了一行:

    var a = document.getElementsByTagName('ul').getElementsByTagName('*');

    同样显示报错,所以问题出在了这个getElementsByTagName上。

    实际上document.getElementsByTagName()虽然数量是1,但是同样是个数组。

    getElementsByTagName()方法的操作对象是一个确定唯一的元素,因此不满足。

    将3行改为  var aEle = Parent(0).getElementsByTagName('*'); 即可。

    ps:

    在获得元素后,可用innerHtml获取和修改元素。

  • 相关阅读:
    Standalone集群搭建和Spark应用监控
    日志信息和浏览器信息获取及数据过滤
    Spark词频前十的统计练习
    Spark-local本地环境搭建
    冒泡排序java
    java反编译
    修改系统环境变量 cmd命令
    java单元测试(Junit)
    spring改版官网下载jar包, 源代码和文档
    打开 chm 帮助文件显示空白及解决方法
  • 原文地址:https://www.cnblogs.com/xmjs/p/12300318.html
Copyright © 2011-2022 走看看