부모 div의 위치가 상대적으로 정의되고 자녀 div의 위치가 절대로 정의된다면, 스타일의 가치는 자녀의 값이 부모 div의 가치와 관련이 있습니다.
이것은 OffSetLeft와 동일합니다. 차이점은 다음과 같습니다.
1. Style.left 28px와 같은 문자열을 반환합니다. OffsetLeft는 28의 값을 반환합니다. 획득 한 값을 계산 해야하는 경우 OffsetLeft를 사용하는 것이 더 편리합니다.
2. style.left는 읽기 쓰기, 오프셋 레프트는 읽기 전용이므로 DIV의 위치를 변경하려면 Style.left 만 수정할 수 있습니다.
3. Style.left의 값은 미리 정의해야합니다. 그렇지 않으면 얻은 값이 비어 있습니다. HTML에서 정의되어야합니다. 나는 그것을 시도했다. CSS로 정의 된 경우 스타일의 가치는 여전히 비어 있습니다. 이것이 처음에 발생한 문제입니다. 나는 결코 style.left의 가치를 얻을 수 없습니다.
DIV의 위치를 미리 정의하지 않고도 오프셋 레프트를 얻을 수 있습니다.
//이 기능은 무한히 분류 된 드롭 다운 상자에서 작업입니다. 처음에는 드롭 다운 상자가 하나뿐입니다. 드롭 다운 상자의 값을 선택하면
선택된 항목을 동적으로 생성하고 선택 항목은 서브 클래스이며 동시에 서브 클래스의 선택 상자는 20px로 다시 이동해야합니다.
코드 사본은 다음과 같습니다.
함수 itemtree_cats_change (selectObj)
JavaScript의 Style.left와 OffsetLeft의 차이점은 다음과 같습니다.
오늘, 초점 회전 목마 사진을 만들 때 문제가 발생했습니다. Style.left를 사용하여 사진의 위치를 얻을 때 얻을 수 없었습니다. OffsetLeft로 전환하여 성공적으로 얻을 수 있습니다. 내가 원하는 효과를 달성했지만 여전히 받아들이기를 원하지 않았습니다. 나는 그 이유를 찾지 못했고 이상하다고 느꼈다. 그래서 고급 JavaScript 프로그래밍을 열고 Style.left 및 OffsetLeft와 관련된 모든 지식 포인트를 살펴보고 다음과 같은 비교를했습니다.
(i) Style.left 클래스 속성의 경우 JavaScript Advanced 프로그램은 다음과 같이 설명합니다.
스타일 기능을 지원하는 모든 HTML 요소는 JavaScript에 해당 스타일 속성을 갖습니다. 이 스타일 객체는 HTML의 스타일 속성으로 지정된 모든 스타일 정보를 포함하지만 외부 스타일 시트 또는 임베디드 스타일 시트로 쌓인 스타일을 포함하지 않는 CSSStyledEclaration의 인스턴스입니다. 스타일 속성에 지정된 모든 CSS 속성은이 스타일 객체의 해당 속성으로 표시됩니다.
(ii) OffsetLeft 누적 특성의 경우 :
OffSetLeft : 요소의 왼쪽 외부 테두리와 요소를 포함하는 요소의 왼쪽 내부 경계 사이의 픽셀 거리.
오프셋 탑 : 요소의 상단 외부 테두리와 요소를 포함하는 요소의 상단 내부 경계 사이의 픽셀 거리.
책을 읽고 오늘 발생하는 문제를 통해 다음과 같은 스타일 요약.
유사성
1. Style.left와 OffsetLeft는 부모 요소에 비해 값입니다.
차이
1. Style.left는 px로 문자열을 반환합니다. OffsetLeft는 숫자 값을 반환합니다.
2. 스타일로 읽을 수있는 내용 .left도 구성 할 수도 있습니다. 오프셋 레프트는 읽을 수 있지만 구성 할 수는 없습니다.