如何将ID添加到<；a href>；使用JavaScript点击

我有一个像这样的HTML 如何使用javascript将ID添加到HTML href

<div class="tab">
    <a href="#">exp</a>
</div>
<div class="tab">
    <a href="#">exp</a>
</div>
<div class="tab">
    <a href="#">exp</a>
</div>
<script>
    var els = document.getElementsByClassName("tab"); 
    // loops els
    for(var i = 0, x = els.length; i < x; i++) {
        els[i].onclick = function(){
        x = document.querySelector(".tab> a")
            // do something
            x.id = "expid";
        }
    }
</script>

var els=document.getElementsByClassName（“选项卡”）；
//环路
对于（变量i=0，x=els.length；ia”）
//做点什么
x、 id=“expid”；
}
}

---

我想在单击此按钮时将id添加到每个标记。请帮帮我。调用

document.querySelector（）

总是返回文档中的第一个

.tab>链接。您可以
this.querySelector（）
返回您单击的DIV中的链接

我已经将代码更改为使用类而不是ID，因为您不应该有重复的ID

在所有的div中循环。如果是用户单击的DIV，则添加该类，否则将其删除


var els=document.getElementsByClassName（“选项卡”）；
//环路
对于（变量i=0，x=els.length；i

.expid{
背景颜色：黄色；
}


你可以这样尝试，这是我用纯js做的一件既酷又简单的事

<div class="tabs">
  ... your html code.
</div>


const tabs = document.querySelector('.tabs')

tabs.addEventListener('click', event => {
   const aTag = event.target
   if (aTag.tagName !== 'A') return
   aTag.id = `EXPID#${getIndexIn(aTag, tabs)}`
})

function getIndexIn(element, parent): number

... 你的html代码。
const tabs=document.querySelector（“.tabs”）
tabs.addEventListener（'click'，event=>{
const aTag=event.target
如果（aTag.tagName！=“A”）返回
aTag.id=`EXPID#${getIndexIn（aTag，tabs）}`
})
函数getIndexIn（元素，父元素）：编号

它的含义是什么？
因此您需要先单击，然后需要循环
x
始终是第一个
a
，与您单击的元素无关。您不应该创建重复的ID，它们应该是唯一的。你应该改用一个类。正如@Barmer提到的，为什么要复制ID？您将不知道引用的是哪个元素。您可以创建一个类、标记或带有类的标记，而不是创建重复的ID。您可以通过使用jQuery.Thks进行设置。但我想点击标签将添加一个类。没有添加其他标记。我这样做了，但它在单击其他标记时不会删除类。问题中没有关于删除类的内容，只是添加了它们。Thk太多了，很抱歉问题不完整。这并没有回答有关在单击元素时添加到元素的问题。
<div class="tabs">
  ... your html code.
</div>


const tabs = document.querySelector('.tabs')

tabs.addEventListener('click', event => {
   const aTag = event.target
   if (aTag.tagName !== 'A') return
   aTag.id = `EXPID#${getIndexIn(aTag, tabs)}`
})

function getIndexIn(element, parent): number