javascript客户端遍历控件与获取父容器对象示例代码

在JavaScript中，遍历DOM（文档对象模型）中的控件并获取它们的父容器对象是一项常见的任务。以下是一个示例代码，展示了如何实现这一功能。在这个例子中，我们将使用递归函数来遍历所有的子元素，并获取它们的父元素。

function traverseDOM(node) {
    // 检查传入的节点是否为null或undefined
    if (!node) {
        console.log('Node is not defined');
        return;
    }

    // 打印当前节点的父容器对象（如果存在）
    if (node.parentNode) {
        console.log('Parent node of', node.nodeName, 'is', node.parentNode.nodeName);
    } else {
        console.log('No parent node for', node.nodeName);
    }

    // 遍历当前节点的所有子节点
    node.childNodes.forEach(child => {
        // 递归调用traverseDOM函数，以遍历每个子节点
        traverseDOM(child);
    });
}

// 假设我们有一个id为'root'的根元素，我们想要遍历它的所有子元素
const rootElement = document.getElementById('root');
if (rootElement) {
    traverseDOM(rootElement);
} else {
    console.log('Element with id "root" not found');
}

在这段代码中，`traverseDOM`函数接受一个DOM节点作为参数。它首先检查该节点是否存在，然后打印该节点的父节点信息（如果存在）。之后，它遍历该节点的所有子节点，并对每个子节点递归调用`traverseDOM`函数。

请注意，在实际应用中，你可能需要根据自己的需求对这段代码进行修改。例如，如果你只对特定类型的节点感兴趣（如`