2013-11-01 12 views
15

Trong DOM, sự khác biệt giữa phần tử offsetHeightscrollHeight của phần tử là gì? Một hình ảnh trong lời giải thích sẽ là một trợ giúp lớn.Sự khác biệt giữa offsetHeight và scrollHeight của một phần tử trong DOM là gì?

+0

Tuyệt vời Câu trả lời là ở đây ... http://stackoverflow.com/questions/4106538/difference-between-offsetheight- và-clientheight –

+1

Trên thực tế @HumanBeing đó là về một cặp khác nhau của các yếu tố. – Dave

Trả lời

20

HTMLElement.offsetHeight là phép đo bao gồm đường viền phần tử, phần tử dọc đệm, thanh cuộn phần tử ngang (nếu có, nếu được hiển thị) và chiều cao CSS phần tử. HTMLElement.scrollHeight là phép đo chiều cao của nội dung của phần tử bao gồm nội dung không hiển thị trên màn hình do tràn. Giá trị được trả về bởi HTMLElement.scrollHeight S include bao gồm phần đệm và phần đệm phía dưới, nhưng sẽ KHÔNG bao gồm các phần tử biên giới hoặc thanh cuộn phần tử ngang.

This trang và this trang là nguồn của tôi.

Tài liệu MDN cũng cung cấp hình ảnh để minh họa.

-1

Như @Csarsam đã nói, chiều cao chênh lệch là chiều cao hộp biên giới (Tôi đang viết lại). Chiều cao cuộn, là chiều cao của nội dung có thể cuộn, thường bao gồm nhiều phần tử. Nhưng chiều cao cuộn nó cũng được xác định trên các phần tử không cuộn, do đó không có nội dung cuộn được, trong trường hợp này (tôi đã kiểm tra nhưng không có tham chiếu để sao lưu) chiều cao cuộn là chiều cao nội dung, nghĩa là, không bao gồm lề và đường viền. Nhưng khi phần tử này là một phần của nội dung có thể cuộn, thì phần tử của nó được tính đến để tính toán chiều cao cuộn của phần tử gốc.

Chiều cao cuộn được xác định trên cả nội dung có thể cuộn và nội dung không thể cuộn, đó là điều có thể gây nhầm lẫn.

Cập nhật

Đây là một tài liệu tham khảo trong đó khẳng định những gì tôi đã kiểm tra: https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight

Các vấn đề liên quan