javascript - 获取调用函数的元素的 ID

Question

如何获取调用 JS 函数的元素的 ID？

body.jpg 是一张狗的图像，当用户将他/她的鼠标指向屏幕上 body 的不同部位时，会显示放大的图像。 area 元素的 ID 等于图像文件名减去文件夹和扩展名。

<div>
    <img src="images/body.jpg" usemap="#anatomy"/>
</div>

<map name="anatomy">
  <area id="nose" shape="rect" coords="280,240,330,275" onmouseover="zoom()"/>
</map>

<script type="text/javascript">
function zoom()
{
 document.getElementById("preview").src="images/nose.jpg";
}
</script>

<div>
<img id="preview"/>
</div>

我已经完成了研究，并将 Stack Overflow 作为最后的手段。我更喜欢不涉及 jQuery 的解决方案。

Answer 1

调用时将元素的引用传递给函数:

<area id="nose" onmouseover="zoom(this);" />

<script>
  function zoom(ele) {
    var id = ele.id;

    console.log('area element id = ' + id);
  }
</script>