Question

目前我正在使用以下代码获取所选元素的路径

if (!(el instanceof Element)) return;
        var path = [];
        while (el.nodeType === Node.ELEMENT_NODE) {
            var selector = el.nodeName.toLowerCase();
            if (el.id) {
                selector += '#' + el.id;
            } else {
                var sib = el, nth = 1;
                while (sib.nodeType === Node.ELEMENT_NODE && (sib = sib.previousSibling) && nth++);
                selector += ":nth-child("+nth+")";
            }
            path.unshift(selector);
            el = el.parentNode;
        }
        return path.join(" > ");

它在我的完整html页面的上下文中返回正确的路径。但是我希望这个功能不是在整个页面上工作，而是在我的html页面的小区域的上下文中。我怎么限制这个功能工作让我们说一些div＃id？

Answer 1

但是我希望这个功能不是在整个页面上工作，而是在我的html页面的小区域的上下文中。我怎么限制这个功能工作让我们说一些div＃id？

听起来你必须在到达那个特定元素时停止遍历树。根据您是否将ID或元素传递给您的函数，您可以执行以下操作：

while (el.nodeType === Node.ELEMENT_NODE && (!el.id || el.id !== SOME_ID)) {

或

while (el.nodeType === Node.ELEMENT_NODE && el !== SOME_ELEMENT) {

Answer 2

你不能，至少不使用DOM API。

DOM API允许您遍历整个DOM，您可以随意上升。如果你有document的引用，你可以自由地做任何事情。

限制访问的一种方法是为DOM API编写包装器。这个包装器将具有您需要的功能，包括：创建新的DOM节点，删除DOM节点，在DOM节点上设置属性。但是你无法自由地走DOM树（因为这打破了你想要的封装）。

这种包装器的细节非常复杂，有很多选择。我正在使用一个内部开发的框架，将它与小部件的符号结合起来，它非常好。

使函数只能看到DOM的特定部分

2 个答案: