Question

是否可以解释字符串DOM关系路径？我希望能够将关系传递给给定节点，并在函数内进行处理。例如，我有这样的函数：

function doSomeStuff ( node, domPath ) {

  var targetNode = node.domPath;

}

电话会是

doSomeStuff( myElement, "parentNode.previousSibling" )

targetNode并不令人惊讶＆＃34;未定义＆＃34; - 可以在这个实例中解析字符串吗？

Answer 1

您可以使用eval，但我不推荐它，因为它可以打开安全漏洞和滥用的大门。

想象一下这样的文件：

<p>
  This is a <strong>test</strong>. With a <span>span</span>.
</p>
<ul>
  <li>one</li>
  <li>two</li>
</ul>

此函数以节点为起点，解析一个＆＃34;路径＆＃34;，它由一系列由句点分隔的字段名称组成，对应于此节点：

function resolvePath(node, path) {
    var start = path.split(".", 1)[0];
    var next = node[start];
    var remainder = path.slice(start.length + 1);
    if (remainder.length === 0)
        return next;
    return resolvePath(next, remainder);
}

使用上面的文档，two console.log调用显示true：

var span = document.querySelector("span");
var ul = document.querySelector("ul");
console.log(resolvePath(span, "parentNode.nextElementSibling") === ul);
console.log(resolvePath(ul, "previousElementSibling.lastElementChild") === span);

这是一个概念证明。我没有照顾路径中无关的空间。此外，如果路径中的任何步骤（除了最后一步）解析为未定义的值，它就会发生炸弹。我发现这是可取的，因为它可以防止路径中的拼写错误，但可能存在轰炸不是理想行为的情况。根据需要进行调整。

Javascript解析DOM关系字符串

1 个答案: