[Event] JQ - event.relatedTarget 속성 - 마우스 이동 시, 막 이탈한 관련 요소 반환. (= 이벤트.릴레이티드타겟 속성)

1. event.relatedTarget 예제
2. event.relatedTarget 정의
3. event.relatedTarget 구문

event.relatedTarget 예제 - 마우스커서 이동 시 이탈한 요소 반환.

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script>

$(document).ready(function(){

  $("div, p").mouseenter(function(event){

    $("#msg").html("관련 타겟 요소: " + event.relatedTarget.nodeName);

  });

});

</script>

<style>

div {height:200px;border:solid}

p {background-color:pink}

span {display:block; margin-top:20px;}

</style>

<div>div 요소 - 홈짱닷컴

  <p>p 요소 - Homzzang.com</p>

</div>

<span id="msg" />

결과보기

주의: p요소 위에 마우스 커서 올려도 부모 요소인 div로 표시됨.

event.relatedTarget 정의

 

마우스커서 이동 시, 들어가거나 나온 요소 반환.

 

event.relatedTarget 구문

 

event.relatedTarget

 

---

[매개변수]

 

event

필수. 이벤트에 바인딩 된 함수에서 가져옴.