웹 퍼블리싱/JS & 웹개발 지식

n번째 요소의 좌표 구하기

꼬지비 2020. 3. 2. 14:03

- Javascript

 

document.getElementsByClassName("aaa")[n].getBoundingClientRect().left

(right도 사용 가능)

 

 

- jQuery

 

$(".aaa").eq(n).offset().left

$(".aaa:eq(n)").offset().left

 

 

- Javascript & jQuery

 

$(".aaa").get(n).getBoundingClientRect().left

 

 

 

eq() 메소드의 경우 제이쿼리 객체로 반환 (제이쿼리 메소드 사용)

get() 메소드의 경우 DOM 객체로 반환(자바스크립트로 조작), 값을 배열로 저장

 

 


 

.toArray()

 

jQuery 객체 안에 있는 DOM 객체들을 자바스크립트 배열로 만들어 준다.

 

 

 

[제이쿼리] eq(), get() 이용한 요소 선택 방법 및 차이점

제이쿼리의 선택자 메소드 eq()와 get()은 둘 다 인덱스 값을 사용해 원하는 위치의 요소를 선택해 가져올 수 있는 선택자 메소드입니다. 예를들면...

클래스명이 icon인 모든 요소들중 두번째 요소만 반환합니다. 또한 아래처럼 음수의 사용이 가능합니다. $('.icon').eq(-2); $('.icon').get(-2); 클래스명이 icon인 모든 요

 

webisfree.com