js에서 오프셋의 의미와 자세한 설명은 무엇인가요?

offset은 "편차, 변위"를 의미하며 "offsetHeight", "offsetWidth", "offsetLeft", "offsetTop" 및 "offsetParent"를 포함한 js의 일련의 속성에 속하며 요소 크기를 얻는 데 사용할 수 있습니다. .

offset family

1, offsetWidth offsetHeight는 개체의 너비와 높이를 가져옵니다(자체 너비와 높이)

offsetWidth = width + border + padding;
        offsetHeight = height + border + padding;
        p.style.width  只能得到行内样式的数值

2, offsetLeft 및 offsetTop은 위쪽에서 왼쪽과 오른쪽 거리를 반환합니다. level box (with positioning) 위의 위치,

부모에 위치 지정이 없으면 몸체가 우선합니다. 여기서 부모는 아버지뿐만 아니라 이전의 모든 수준을 의미하며,

offsetLeft는 아버지의 패딩에서 시작되며, 아버지의 경계는 계산하지 않습니다

3, 애니메이션 완화 공식

    var start=0,  end = 0;
        setInterval(function(){
                start = start + (end - start)/10;
        }, 30);

4, offsetParent는 parentNode와 유사한 객체의 부모(위치 지정이 있는 상위)를 반환합니다. 위치 지정이 없으면 본문을 반환합니다.

차이점: parentNode는 parent, offsetParent는 아빠, 할아버지 등이 될 수 있습니다.

5, offsetTop, offsetLeft와 style.top, style.left의 차이

5.1 offsetTop, offsetLeft는 위치가 지정되지 않은 상자의 상단 또는 왼쪽으로부터의 위치일 수 있습니다

5.2 style.top, style. 왼쪽에 위치한 상자에만 top 또는 left가 있습니다.

5.3 offsetTop은 숫자를 반환하고 style.top은 문자열을 반환합니다. px

5.4 offsetTop은 읽기 전용이고 style.top은 읽고 쓸 수 있습니다.

5.5 html 요소에 top 스타일이 지정되지 않은 경우 style.top은 빈 문자열을 반환합니다.

5.6 style.width는 다음 값만 가져올 수 있습니다. 인라인 스타일

관련 권장 사항:

php

JS의 오프셋 및 균일 모션 인스턴스 분석

오프셋이 과도한 SQL 최적화 예제 공유 페이징 mysql

위 내용은 js에서 오프셋의 의미와 자세한 설명은 무엇인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!