bbc interaction 공부 3

자바스크립트 코드 분석

document.querySelectorAll();
dataset.index = i;
getBoundingRect();

1. querySelectorAll 메서드를 사용했다.

2. for 문으로 setAttribute('data-index', i) 메서드를 활용해 data 속성을 부여했다.

   여기서 setAttribute 메서드는 IE 저버전까지 호환되기 때문에 사용했다.
   IE 저버전을 고려할 필요가 없다면 다음 API를 활용하면 된다.

3. dataset.index = i;

   IE 11만 지원한다.

4. 현재 텍스트들의 위치 정보를 어떻게 가져올 것인가?

   getBoundingRect() 메서드로 DOMRect() 객체를 return받으면 된다.
   해당 객체엔 해당 요소의 위치 및 레이아웃 정보가 담겨져있다.