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获取和修改元素。

  • 相关阅读:
    DBSCAN算法及sklearn实现
    K-MEANS算法及sklearn实现
    Linux删除有规则文件夹,比如(50-100)
    11.tensorboard网络结构
    10.优化器
    9.正则化
    8.Dropout
    Linux中awk后面的RS, ORS, FS, OFS 含义
    hadoop 客户的的使用
    shell中的>&1和 >&2是什么意思?
  • 原文地址:https://www.cnblogs.com/xmjs/p/12300318.html
Copyright © 2011-2022 走看看