Javascript 如何获取锚定标记的id，而不考虑它在层次结构中的位置？

我希望获得锚标记的id/class/both，而不管它在标记层次结构中的什么位置。下面的例子很奇怪，但对我来说很现实，因为我们的网站是通过CMS访问的，我无法控制。如果人们在不同的时间添加多个级别的格式，CMS喜欢添加新的span

因此，让用户了解上述事实，我想通过id/类/两者来确定特定的锚定标记，但我并不总是知道它们在标记深入中的位置

<div id="div_id_A" class="div_class_A">
    <div class="div_class_A">
        <a href="#" id="anchor_id_A" class="anchor_class_A">
            <span class="span_class_A">
                <span id="span_id_B">
                    <span id="span_id_C" class="span_class_C">
                        <p>
                            Click Me
                        </p>
                    </span>
                </span>
            </span>
         </a>
     </div>
</div>

---

澄清。我之所以指定锚点是有原因的，不仅仅是因为这个例子。由于我受到CMS的限制，我无法进入并向预定义代码（即模板）添加标记，但我确实需要尽可能准确地知道单击了哪个链接（对于Google Analytics），以便我可以跟踪用户忽略、没有看到或更喜欢的内容。

您可以在层次结构上导航，直到到达锚元素，然后读取它的ID

请看这里：

var dataLayer=dataLayer | |[]；
document.addEventListener（'click'，函数（事件）{
var el=事件目标；
而（el.parentElement&&el.tagName！=“A”）{
el=el.parentElement；
}
数据层推送({
“你”是什么意思
});
console.log（数据层）；
警报（el.id）；
});
您可以在层次结构中向上导航，直到到达锚元素，然后读取其ID

请看这里：


var dataLayer=dataLayer | |[]；
document.addEventListener（'click'，函数（事件）{
var el=事件目标；
而（el.parentElement&&el.tagName！=“A”）{
el=el.parentElement；
}
数据层推送({
“你”是什么意思
});
console.log（数据层）；
警报（el.id）；
});
您试图实现的目标可能是：


var数据层=[]；
document.addEventListener（'click'，函数（事件）{
var needle='anchor_class_A'；//要查找的元素的类
var最近=事件目标最近（“.”+指针）；
if（最近的和最近的.id）{
数据层推送({
“youClicked”：最近的.id
});
警报（JSON.stringify（dataLayer，null，“\t”）；
}
});
您试图实现的目标可能是：


var数据层=[]；
document.addEventListener（'click'，函数（事件）{
var needle='anchor_class_A'；//要查找的元素的类
var最近=事件目标最近（“.”+指针）；
if（最近的和最近的.id）{
数据层推送({
“youClicked”：最近的.id
});
警报（JSON.stringify（dataLayer，null，“\t”）；
}
});

如果需要所有锚元素的列表，可以使用
document.getElementsByTagName（“a”）
。。看到这个了吗？你能不能把点击处理程序附加到所有的标签上，然后读这个.id？如果你想要一个所有锚元素的列表，你可以使用
document.getElementsByTagName（“a”）
。。看到了吗？你能不能不把点击处理程序附加到所有的标签上，然后读这个.id？问题是找到合适的锚元素，而不是访问它的id。@Shomz那么你对元素有什么信息？如果我不知道ID，如何识别正确的元素？例如，如果您知道该类，可以使用
document.getElementsByClassName
。。。OP只知道单击的元素，并希望找到锚ID，它位于层次结构中的某个位置。。。至少我是这样理解并写下我的答案的。@Shomz，这是正确的。最后，我将使用脚本访问多个未知层次结构中的多个不同锚。如果我对静态DOM有更多的控制，那么我会使它更友好。目前还没有实现任何东西。我将尝试这两个答案，直到我让他们失败。我接受了上面的答案，因为它适用于我的问题。尽管如此，正如@JohnSlegers所指出的，这个答案可以更加灵活。我不会就此进行辩论，因为我没有足够的JS知识来进行超出我理解范围的辩论。问题是找到合适的锚元素，而不是访问其ID。@Shomz那么关于你的元素，你有什么信息？如果我不知道ID，如何识别正确的元素？例如，如果您知道该类，可以使用
document.getElementsByClassName
。。。OP只知道单击的元素，并希望找到锚ID，它位于层次结构中的某个位置。。。至少我是这样理解并写下我的答案的。@Shomz，这是正确的。最后，我将使用脚本访问多个未知层次结构中的多个不同锚。如果我对静态DOM有更多的控制，那么我会使它更友好。目前还没有实现任何东西。我将尝试这两个答案，直到我让他们失败。我接受了上面的答案，因为它适用于我的问题。尽管如此，正如@JohnSlegers所指出的，这个答案可以更加灵活。我不会就此争论，因为我没有足够的JS知识来进行超出我理解范围的辩论。谢谢，这完全符合我的期望。使用多个未知项进行测试。添加了if语句以过滤掉不受欢迎的内容（无论它们是什么；对于em，它们是空格单击）<代码>document.addEventListener（'click'，函数（事件）{var el=event.target；而（el.parentElement&&el.tagName！='A'）{el=el.parentElement；}如果（el.id！=''{alert（el.id）；}）抱歉，不知道如何将上面的代码作为一个块。@rorschaff，很酷，所以您正在创建所有这些锚的列表，前提是它们确实有ID，对吗？（您不能将注释代码设置为块，但我看到了您添加的内容）谢谢，这完全符合您的要求。使用多个未知项进行测试。添加了if语句以过滤不受欢迎的项（无论
var dataLayer = dataLayer || [];

document.addEventListener('click', function(event) {
    var telm = event.target.parentNode.className;
    var delm = 'anchor_id_A';
    console.log(telm);
    if (telm == delm) {
        dataLayer.push({
            'youClicked': telm
        });
        console.log(dataLayer);
    };
});

*WHERE: telm = target element; delm = desired element.