IntersectionObserver 화면에 특정 엘리먼트가 보이면?!

• 뷰포트에 들어오는 것을 감지할 수 있다

example.ts

// 검색창 인풋 오토포커스

const observer = new IntersectionObserver((entries) => {
  if (!entries[0].intersectionRatio) return;
  document.querySelector('input.searchbox-input').focus();
});

observer.observe(document.querySelector('input.searchbox-input'));

• 위 코드는 검색창을 켜면 인풋에 오토포커스 되도록하는 코드이다

참고

• 이미지 레이지로딩
• https://developer.mozilla.org/ko/docs/Web/API/IntersectionObserver