javascript - DOM 行走功能不起作用

标签 javascript

我创建了一个简单的函数,它执行类似于 getElementsByClassName() 的任务。它应该遍历 DOM 中的每个节点并将具有匹配类的节点推送到数组中。我尝试使用类似于 Crockford 的 walk_the_DOM 方法的方法,但是我的方法不起作用。该函数检索第一个 DOM 级别上的节点,但不会更深入。有人可以给我一个提示,告诉我出了什么问题吗?代码如下:

var getNodesWithClassname = function(classname) {
  var a = document.body;
  var ar = [];
  var getNodes = function(obj, classname) {
    if (obj.hasChildNodes()) {
      var child = obj.firstElementChild;
      while (child) {
        if (child.className === classname) {
          ar.push(child)
        }
        child = child.nextElementSibling;
      }
    }
  }
  getNodes(a, classname);
  return ar;
};

最佳答案

如果元素是带有子元素的元素,则需要递归:

var getNodesWithClassname = function(classname) {
  var a = document.body;
  var ar = [];
  var getNodes = function(obj, classname) {
    if (obj.hasChildNodes()) {
      var child = obj.firstElementChild;
      while (child) {
        if (child.className === classname) {
          ar.push(child)
        }
        if (child.nodeType === 1 && child.childElementCount > 0) {
          getNodes(child, classname);
        }
        child = child.nextElementSibling;
      }
    }
  }
  getNodes(a, classname);
  return ar;
};

关于javascript - DOM 行走功能不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19429031/

相关文章:

javascript - ng 类未应用

java - 如何在 Java 和 JavaScript 之间传递字节数组

javascript - Google Maps API,使用 KML 文件, map 为空白

javascript - 调整浏览器窗口大小时图像不会调整大小 (elm)

javascript - 在单独的页面上显示结果

javascript - HTTP 响应中的意外内容

javascript - 在 Backbone 应用程序的渲染功能上使用 addClass() 和 CSS transition 无法正常工作

javascript - 获取 nodeValue 时输出为 null

javascript - 无法从 javascript 书中理解这些示例,好的部分

javascript - 如何在页面刷新时在 JavaScript 中删除后添加子元素