javascript - getElementById() 用于元素的子元素

Question

getElementById()在document物体上。

如果我已经有一个元素引用，我如何找到具有给定 ID 的孩子（或孩子的孩子等）？

var parent = document.getElementById(parentId),
    child = parent.getElementById(childId);

此代码失败，因为页面上的普通元素没有getElementById方法。

（我处于维护模式，ID 不一定是唯一的，不能使用 jQuery）。

Answer 1

你可以使用querySelector()：

child = parent.querySelector("#" + childId);

Answer 2

您可以自己循环所有子节点吗？

可能是这样的：

GetChildElementByID = function (rootElement, id){
    var children = GetAllNodes(rootElement);
    for(var i in children){
        var element = children[i];
        if(element.id == id){
            return element;
        } 
    }
    return null;
}

GetAllNodes = function (rootElement) {
    var nodes = [];
    var childNodes = rootElement.childNodes;
    for (var i in childNodes) {
        var node = childNodes[i];
        if (node.nodeType) {
            nodes.push(node);
        }
        nodes.push.apply(nodes, GetAllNodes(node));
    }
    return nodes;
}

Answer 3

查询选择器可以找到父母的孩子。

document.querySelector("#parentID > #childID");