ภายใต้มาตรฐานที่กำหนดไว้ใหม่ Documentedlementedlement.Clientheight สามารถรับค่าที่ถูกต้องใน IE และ Firefox
<ภาษาสคริปต์ = "JavaScript">
ฟังก์ชั่น getinfo ()
-
var s = "";
s + = "หน้าเว็บเป็นความกว้างของพื้นที่ที่มองเห็นได้:" + document.body.clientwidth ;
S + = "พื้นที่ที่มองเห็นได้สูง:" + document.body.clientheight ;
S + = "ความกว้างของพื้นที่หน้าเว็บที่มองเห็นได้:" + document.body.offsetWidth + "(รวมถึงความกว้างของขอบและแถบเลื่อน)";
S + = "พื้นที่ที่มองเห็นได้สูงกว่าหน้าเว็บ:" + document.body.offSetheight + "(รวมถึงความกว้างของขอบ)";
s + = "ข้อความหน้าเว็บความกว้างข้อความแบบเต็ม:" + document.body.scrollwidth;
s + = "ข้อความหน้าเว็บข้อความสูงสูง:" + dcument.body.scrollheight;
s + = "ff) ที่กลิ้งออกไปจากหน้าเว็บ:" + document.body.scrolltop;
s + = "IE):" + document.documentElement.scrolltop;
s + = "หน้าเว็บจะถูกม้วนขึ้นทางด้านซ้าย:" + document.body.scrollleft;
s + = "ส่วนข้อความหน้าเว็บ:" + window.screentop;
s + = "หน้าเว็บส่วนข้อความซ้าย:" + window.screenleft;
s + = "ความละเอียดหน้าจอสูง:" + window.screen.height;
s + = "ความกว้างความละเอียดหน้าจอ:" + window.screen.width;
s + = "หน้าจอความสูงพื้นที่ทำงาน:" + window.screen.availheight;
s + = "หน้าจอความกว้างพื้นที่ทำงาน:" + window.screen.availwidth;
s += "การตั้งค่าหน้าจอของคุณคือ" +window.screen.colordepth +"สีบิต";
s += "การตั้งค่าหน้าจอของคุณ" +window.screen.devicexdpi +"พิกเซล/นิ้ว";
การแจ้งเตือน;
-
getinfo ();
</script>
ในการทดสอบในท้องถิ่น:
คุณสามารถใช้ภายใต้ IE, Firefox, Opera
document.body.clientwidth
document.body.clitingheight
สามารถรับได้ง่ายและสะดวกมาก
และในโครงการ บริษัท :
โอเปร่ายังคงใช้
document.body.clientwidth
document.body.clitingheight
แต่ใช้เช่นและ firefox
document.documentelement.clientwidth
document.documentelement.clientheight
< !
หากคุณเพิ่มบรรทัดนี้ลงในหน้า
ใน IE:
document.body.clientwidth ==> ความกว้างของวัตถุร่างกาย
document.body.clitingHeight ==> ความสูงของวัตถุร่างกาย
Document.DocumentElement.ClientWidth ==> ความกว้างของพื้นที่ที่มองเห็นได้
document.documentelement.clientheight ==> ความสูงของพื้นที่ที่มองเห็นได้
ใน Firefox:
document.body.clientwidth ==> ความกว้างของวัตถุร่างกาย
document.body.clitingHeight ==> ความสูงของวัตถุร่างกาย
Document.DocumentElement.ClientWidth ==> ความกว้างของพื้นที่ที่มองเห็นได้
document.documentelement.clientheight ==> ความสูงของพื้นที่ที่มองเห็นได้
ในโอเปร่า:
document.body.clientwidth ==> ความกว้างของพื้นที่ที่มองเห็นได้
document.body.clitingHeight ==> ความสูงของพื้นที่ที่มองเห็นได้
Document.DocumentElement.ClientWidth ==> ความกว้างของวัตถุหน้า (เช่นความกว้างของวัตถุร่างกายบวกความกว้างมาร์จิ้น)
document.documentelement.clientheight == >> ความสูงของวัตถุหน้า (นั่นคือความสูงของวัตถุร่างกายบวกระยะขอบสูง)
สมมติว่า OBJ เป็นตัวควบคุม HTML
OBJ.OffSettop หมายถึงตำแหน่งจำนวนเต็มและพิกเซลหน่วยจากการควบคุมด้านบนหรือบน -ชั้นบน
OBJ.OffsetLeft หมายถึงตำแหน่งจำนวนเต็มหน่วยพิกเซลจากตัวควบคุมซ้ายหรือด้านบน
obj.offsetWidth หมายถึงความกว้าง, จำนวนเต็ม, พิกเซลหน่วยของการควบคุม OBJ
OBJ.OffSetheight หมายถึงความสูง, จำนวนเต็ม, หน่วยพิกเซลของ OBJ ควบคุมตัวเอง
เราอธิบาย "ชั้นบนหรือชั้นบน" และ "เลเยอร์ซ้ายหรือชั้นบน" ที่กล่าวถึงก่อนหน้านี้
ตัวอย่างเช่น:
<div id = "เครื่องมือ">
<อินพุต type = "ปุ่ม" value = "ส่ง">
<อินพุต type = "ปุ่ม" value = "รีเซ็ต">
</div>
ปุ่มออฟเซ็ตต์ของปุ่ม "ส่ง" หมายถึงระยะห่างระหว่างเลเยอร์ "เครื่องมือ" บนเลเยอร์ "เครื่องมือ" เนื่องจากใกล้กับเฟรมด้านบนของเลเยอร์ "เครื่องมือ" ที่อยู่ใกล้ที่สุด
ออฟเซ็ตต์ของปุ่ม "รีเซ็ต" หมายถึงระยะห่างระหว่างเลเยอร์ "เครื่องมือ" บนเลเยอร์ "เครื่องมือ" เนื่องจากใกล้กับเฟรมด้านบนของเลเยอร์ "เครื่องมือ" ที่อยู่ใกล้ที่สุด
Offsetleft ของปุ่ม "ส่ง" หมายถึงระยะห่างระหว่างเลเยอร์ "เครื่องมือ" ของปุ่ม "ส่ง" เนื่องจากด้านซ้ายของเลเยอร์ "เครื่องมือ" ที่อยู่ใกล้กับด้านซ้ายของเลเยอร์ "เครื่องมือ" คือด้านซ้าย
Offsetleft ของปุ่ม "รีเซ็ต" หมายถึงระยะทางของปุ่ม "ส่ง" จากปุ่ม "ส่ง" เนื่องจากกรอบด้านขวาของปุ่ม "ส่ง" ที่อยู่ใกล้ที่สุดคือด้านขวาของปุ่ม "ส่ง"
Offsettop สามารถรับตำแหน่งขององค์ประกอบ HTML จากด้านบนหรือองค์ประกอบด้านนอกและ style.top ก็เป็นไปได้เช่นกัน
1. Offsettop ส่งคืนตัวเลขในขณะที่ style.top ส่งคืนสตริง
2. Oftsettop อ่านได้เท่านั้นในขณะที่ style.top สามารถอ่านและเขียนได้
ประการที่สามหากคุณไม่ได้ระบุสไตล์ด้านบนสำหรับองค์ประกอบ HTML style.top จะส่งคืนสตริงที่ว่างเปล่า
Offsetleft and Style.left, OffsetWidth และ Style.width, Offsetheight และ Style.head เหมือนกัน
Scrollheight: รับความสูงของวัตถุ
Scrollleft: ตั้งค่าหรือรับระยะห่างระหว่างปลายด้านซ้ายของเนื้อหาที่มองเห็นได้ในปัจจุบันในขอบเขตซ้ายและหน้าต่างของวัตถุ
Scrolltop: ตั้งค่าหรือรับระยะห่างระหว่างด้านบนของวัตถุและด้านบนของหน้าต่างในหน้าต่าง
Scrollwidth: รับความกว้างการเลื่อนของวัตถุ
Offsetheight: ความสูงของพิกัดหลักที่ระบุโดยแอตทริบิวต์ OffsetParent โดยวัตถุที่ได้รับ
Offsetleft: สำหรับการคำนวณตำแหน่งซ้ายของพิกัดปรมาจารย์ของพิกัดปรมาจารย์ที่ระบุโดยแอตทริบิวต์ OffsetParent
OFFSETTOP: ตำแหน่งสูงสุดของการคำนวณพิกัดปรมาจารย์ของรูปแบบที่ระบุโดยแอตทริบิวต์ออฟเซ็ตท็อป
Event.celientx พิกัดแนวนอนของเอกสารสัมพัทธ์
Event.Clienty พิกัดในแนวตั้งของเอกสารสัมพัทธ์
Event.offsetx พิกัดแนวนอนของคอนเทนเนอร์สัมพัทธ์
Event.offsety ของพิกัดแนวตั้ง
document.documenetelement.scrolltop Valted Valley Rolling Valley
event.clientx+document.documentelement.scrolltop ฉลากที่นั่งแนวนอนของเอกสารสัมพัทธ์+ปริมาณของการหมุนแนวตั้งการหมุน
ส่วนใหญ่หมายถึงความแตกต่างระหว่าง Firefox ใน IE: ดังนี้:
IE6.0, ff1.06+:
clientWidth = width + padding
clientHeight = ความสูง + ช่องว่างภายใน
OffsetWidth = Width + Padding + Border
Offsetheight = ความสูง + ช่องว่าง + เส้นขอบ
IE5.0/5.5:
clientWidth = ความกว้าง -border
clientHeight = ความสูง -border
OffsetWidth = ความกว้าง
Offsetheight = ความสูง
(จำเป็นต้องพูดถึง: คุณลักษณะมาร์จิ้นใน CSS ไม่เกี่ยวข้องกับ ClientWidth, OffsetWidth, ClientHeight, Officetheight)