SOURCE

console 命令行工具 X clear

                    
>
console
class Node {
        constructor(node) {
            this.rootNode = node
        }

        getElementById(id) {
            let node = this.rootNode
            while (node) {
                if (node.id === id) {
                    return node
                }
                node = this.nextNode(node)
            }
            return null
        }

        nextNode(node) {
            // 优先遍历子节点
            if (node.children.length) {
                return node.children[0]
            }
            // 只会遍历根节点的子节点
            if (this.rootNode === node) {
                return null
            }
            // 然后遍历兄弟节点
            if (node.nextElementSibling) {
                return node.nextElementSibling
            }
            // 最后遍历父节点的兄弟节点,因为父节点已经被遍历过了
            while (node.parentNode) {
                if (node.parentNode.nextElementSibling) {
                    return node.parentNode.nextElementSibling
                }
                node = node.parentNode
            }
            return null
        }
}
			const rengar = document.querySelector(".rengar")
    	const nodeObj = new Node(rengar)
    	console.log(nodeObj.getElementById("renger-log"))
<div class="rengar">
  <div id="renger-log"></div>
</div>