คุณสมบัติ scrollHeight ของ HTML DOM Element

คำอธิบายและการใช้งาน

scrollHeight คุณสมบัติกลับมาด้วยความสูงขององค์ประกอบ ด้วยพิกัดพิเศษ (pixel) รวมถึง padding แต่ไม่รวม border, scrollbar หรือ margin。

scrollHeight คุณสมบัติเป็นค่าเพียงได้นับเท่านั้น。

หมายเหตุ:scrollWidth และ scrollHeight ทั้งหมดกลับมาด้วยความสูงและความกว้างขององค์ประกอบทั้งหมด รวมถึงส่วนที่ไม่เห็น (เนื่องจาก overflow)。

ดูเพิ่มเติมที่:

คุณสมบัติ scrollWidth

CSS overflow คุณสมบัติ

ตัวอย่าง

ตัวอย่าง 1

เรียกข้อมูลความสูงและความกว้างขององค์ประกอบ รวมถึง padding:

const element = document.getElementById("content");
let x = element.scrollHeight;
let y = element.scrollWidth;

ทดลองด้วยตัวเอง

ตัวอย่าง 2

padding, border และ scrollbar จะทำอย่างไรต่อ scrollWidth และ scrollHeight:

const element = document.getElementById("content");
let x = element.scrollHeight;
let y = element.scrollWidth;

ทดลองด้วยตัวเอง

ตัวอย่าง 3

ตั้งค่าความสูงและความกว้างขององค์ประกอบเป็นค่าที่กลับมาจาก scrollHeight และ scrollWidth:

element.style.height = element.scrollHeight + "px";
element.style.width = element.scrollWidth + "px";

ทดลองด้วยตัวเอง

ภาษาเขียน

element.scrollHeight

ค่าที่กลับมา

ประเภท คำอธิบาย
ตัวเลข ความสูงขององค์ประกอบ ด้วยพิกัดพิเศษ (pixel)。

การสนับสนุนของเบราซเซอร์

ทุกเบราซเซอร์ทุกครั้งสนับสนุน element.scrollHeight：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน