查找调用JavaScript函数的HTML元素的ID

我有一个三按钮导航面板，由三个div和一个锚组成。在鼠标悬停时，myFunction（）为三个div和锚定标记分配一个类，用于设置样式

<nav>
    <div id="btn1" class="button" onMouseOver="myFunction();">
    <div id="btn_bdr1">
    <div id="btn_bdr2">
        <a href="#"></a>
    </div>
    </div>
    </div>

    <div id="btn3" class="button" onMouseOver="myFunction();">
    <div id="btn_bdr1">
    <div id="btn_bdr2">
        <a href="#"></a>
    </div>
    </div>
   </div>

    <div id="btn2" class="button"  onMouseOver="myFunction();">
    <div id="btn_bdr1">
    <div id="btn_bdr2">
        <a href="#"></a>
    </div>
    </div>
    </div>
</nav>

我需要做的是找到调用myFunction（）的div的ID，这样我就可以在函数中只修改调用div，而不是全部三个

仅使用JavaScript，我如何才能开始这样做

---

提前谢谢

有两种方法可以做到：

1） 向具有div名称的方法发送参数

示例

<div id="btn1" class="button" onMouseOver="myFunction('btn1')">

<div id="btn1" class="button" onMouseOver="myFunction(this)">

---

有两种方法可以做到这一点

1） 向具有div名称的方法发送参数

示例

<div id="btn1" class="button" onMouseOver="myFunction('btn1')">

<div id="btn1" class="button" onMouseOver="myFunction(this)">

---

您可以使用

事件

对象查看目标（

e.target

）。这是对元素本身的引用，因此要获取ID，只需访问元素的

ID

属性即可。（

e.target.id

）

document.querySelectorAll（'.a'）.forEach（函数（ele，ind）{
ele.addEventListener（“鼠标悬停”，函数（e）{
日志（e.target，e.target.id）；
})
});
.a{
高度：40px；
宽度：40px；
边框：纯黑3px；
边缘顶部：5px；
}
您可以使用
事件
对象查看目标（
e.target
）。这是对元素本身的引用，因此要获取ID，只需访问元素的
ID
属性即可。（
e.target.id
）


document.querySelectorAll（'.a'）.forEach（函数（ele，ind）{
ele.addEventListener（“鼠标悬停”，函数（e）{
日志（e.target，e.target.id）；
})
});
.a{
高度：40px；
宽度：40px；
边框：纯黑3px；
边缘顶部：5px；
}
您可以从
myFunction（）
调用
this.event.target
，以确定生成事件的元素

例如：

myFunction() {
   console.log("I was called by: ", this.event.target);
}

您可以从
myFunction（）
调用
this.event.target
，以确定生成事件的元素

例如：

myFunction() {
   console.log("I was called by: ", this.event.target);
}

谢谢Fyllekanin，您的答案与我想要的最接近，尽管我使用了myFunction（this.id），因为我需要的是id，而不是元素。我将用实际使用的代码块更新帖子。谢谢Fyllekanin，你的答案与我想要的最接近，尽管我使用了myFunction（this.id），因为我需要的是id，而不是元素。我将用实际使用的代码块更新帖子。