1. ホーム
  2. javascript

[解決済み] 関数を呼び出した要素のIDを取得する

2023-07-12 06:14:32

質問

JS関数を呼び出した要素のIDを取得するにはどうしたらよいですか?

body.jpg は犬の画像で、ユーザーがマウスを画面上でポイントすると、体の様々な部分が拡大表示されます。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を伴わない解決策を希望しています。

どのように解決するのですか?

関数が呼び出されたときに、要素への参照を関数に渡します。

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

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

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