jQuery / JAVASCRIPT offset 과 position 차이점

jQuery / JAVASCRIPT offset 과 position 차이점

jQuery 로 가져오는 방법

$('#tLayer').offset().left

$('#tLayer').offset().top

$('#tLayer').position().left

$('#tLayer').position().top

자바스크립트로 가져오는 방법

document.getElementById('tLayer').offsetLeft

document.getElementById('tLayer').offsetTop

document.getElementById('tLayer').style.left

document.getElementById('tLayer').style.top

차이점을 직접 테스트 하도록 해보자.

DIV ID : tLayer

DIV style : margin:5px

jQuery
Javascript

offset 은 margin 을 포함한 값이고

position 은 margin 이 누락된 값을 리턴한다.

그리고 javascript 에서 position 은 style.left = '100px' 이렇게 값을 설정해야지 값이 나타난다.