[JavaScript] 자바스크립트에서 포커스 확인하기

104_자바스크립트에서 포커스 확인하기

[적용]

• 페이지의 포커스 유무를 확인하고 싶을 때
• 페이지에 포커스가 맞춰져 있을 때만 음악을 재생하고 싶을 때

---

[문법]

이벤트	발생 타이밍
focus	포커스가 맞춰져 있을 때
blur	포커스를 벗어나 있을 때

---

[내용]

해당 페이지의 포커스 상태 여부는 이벤트를 통해 확인할 수 있다.

focus 이벤트는 포커스가 맞춰졌을 때 발생하는 이벤트이며, blur는 그 반대의 이벤트다.

예를 들어, 웹에서 BGM을 재생하고 싶을 때는 focus와 blur를 사용하여 재생과 정지를 할 수 있다.

 

window.addEventListener('focus', () => {
	document.querySelector('#log').innerHTML = '포커스 상태';
});

window.addEventListener('blur', () => {
	document.querySelector('#log').innerHTML = '포커스를 벗어난 상태';
});

 

---

 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김