Javascript 根据元素在页面上的位置操纵元素

因此，在我的代码中，当您单击某个元素时，它将发现该元素的路径并向其发出警报。然后我想“保存”元素的路径，然后单击按钮，找到它并向其添加一个红色边框

函数nodelistToArray（nodelist）{
返回Array.prototype.slice.call（nodelist）；
}
功能遍历（目标、链）{
如果（链===void 0）{
链=[]；
}
var index=NodeListArray（target.parentNode.children.filter）（函数（a）{
返回a.nodeName==target.nodeName；
}).indexOf（目标公司）；
推链({
要素：目标，
索引：索引
});
if（target.nodeName.toLowerCase（）=“html”）{
返回链。反向（）；
}否则{
返回遍历（target.parentNode，chain）；
}
}
document.addEventListener（“单击”，eOnClick，true）；
功能单击（evt）{
var链=导线（evt.目标）；
警报（chain.map）（函数（elm）{
返回elm.element.nodeName+'['+（elm.index.toString（）+']；
})。加入（“>”）；
}

一,
二,
三,

一,
二,
三,

一,
二,
三,

一,
二,
三,
一,。单击上面的一个元素

二,。警报将告诉您此元素的位置

三,。单击下面的按钮向元素添加红色边框
单击“我”

不需要找出元素的路径。您可以像这样获得元素 并应用css

document.addEventListener('click', function(e) {
    e = e || window.event;
    var target = e.target || e.srcElement;
        target.setAttribute('style','border:10px solid red');   
}, false);

---

是否绝对有必要解析节点的路径，而不考虑样式需求？我真正想要实现的是获取元素作为变量，我可以稍后使用，就像我将其硬编码到javascript中以供引用一样。您可以使用您的方法将元素存储为变量，但可以使用上述方法将css应用于单击的元素