HTML โหนด DOM
ใน HTML DOM (Document Object Model) ทุกอย่างเป็นโหนด:
- เอกสารที่ตัวเองเป็นโหนดเอกสาร
- องค์ประกอบ HTML ทั้งหมดอยู่ในโหนดองค์ประกอบ
- แอตทริบิวต์ HTML ทั้งหมดอยู่ในโหนดแอตทริบิวต์
- ข้อความภายในองค์ประกอบ HTML มีโหนดข้อความ
- ความคิดเห็นที่โหนดแสดงความคิดเห็น
วัตถุธาตุ
ใน DOM HTML, วัตถุธาตุหมายถึงองค์ประกอบ HTML
วัตถุธาตุสามารถมีโหนดลูกของโหนดประเภทองค์ประกอบโหนดข้อความหรือโหนดแสดงความคิดเห็น
วัตถุ NodeList แสดงให้เห็นถึงรายชื่อของโหนดเช่นคอลเลกชันองค์ประกอบ HTML ของโหนดเด็ก
องค์ประกอบยังสามารถมีแอตทริบิวต์ แอตทริบิวต์โหนดแอตทริบิวต์ (See next chapter)
สนับสนุนเบราว์เซอร์
| วัตถุ | |||||
|---|---|---|---|---|---|
| Element | ใช่ | ใช่ | ใช่ | ใช่ | ใช่ |
| NodeList | ใช่ | ใช่ | ใช่ | ใช่ | ใช่ |
วัตถุธาตุและวัตถุ NodeList ได้รับการสนับสนุนในเบราว์เซอร์ที่สำคัญทั้งหมด
คุณสมบัติและวิธีการ
คุณสมบัติและวิธีการดังต่อไปนี้สามารถใช้กับองค์ประกอบ HTML ทั้งหมด:
| คุณสมบัติ / วิธี | ลักษณะ |
|---|---|
| element .accessKey | ตั้งหรือส่งกลับ accesskey แอตทริบิวต์ขององค์ประกอบ |
| element addEventListener() | แนบตัวจัดการเหตุการณ์ไปยังองค์ประกอบที่ระบุ |
| element appendChild() | เพิ่มโหนดเด็กใหม่เพื่อที่จะองค์ประกอบเป็นโหนดเด็กที่ผ่านมา |
| element .attributes | ส่งกลับ NamedNodeMap ของคุณลักษณะองค์ประกอบของ |
| element blur() | เอาโฟกัสจากองค์ประกอบ |
| element .childElementCount | ส่งกลับจำนวนขององค์ประกอบของเด็กเป็นองค์ประกอบที่มี |
| element .childNodes | ผลตอบแทนที่ได้คอลเลกชันของโหนดเด็กเป็นองค์ประกอบ (รวมถึงข้อความและแสดงความคิดเห็นโหนดบริการ) |
| element .children | ผลตอบแทนที่ได้คอลเลกชันขององค์ประกอบเด็กเป็นองค์ประกอบของ (ไม่รวมข้อความและแสดงความคิดเห็นโหนด) |
| element .classList | ส่งกลับชั้น name(s) ขององค์ประกอบ |
| element .className | ตั้งค่าหรือผลตอบแทนที่คุ้มค่าของ class แอตทริบิวต์ขององค์ประกอบ |
| element click() | จำลองการคลิกเมาส์บนองค์ประกอบ |
| element .clientHeight | ผลตอบแทนที่สูงขององค์ประกอบรวมทั้งการขยาย |
| element .clientLeft | ส่งกลับความกว้างของขอบด้านซ้ายของธาตุนั้น |
| element .clientTop | ส่งกลับความกว้างของเส้นขอบด้านบนของธาตุนั้น |
| element .clientWidth | ส่งกลับความกว้างขององค์ประกอบรวมทั้งการขยาย |
| element cloneNode() | โคลนนิ่งองค์ประกอบ |
| element compareDocumentPosition() | เปรียบเทียบตำแหน่งเอกสารสององค์ประกอบ |
| element contains() | ผลตอบแทนจริงถ้าโหนดเป็นลูกหลานของโหนดเท็จอย่างอื่น |
| element .contentEditable | ชุดหรือผลตอบแทนไม่ว่าจะเป็นเนื้อหาขององค์ประกอบคือสามารถแก้ไขได้หรือไม่ |
| element .dir | ชุดหรือผลตอบแทนที่คุ้มค่าของ dir แอตทริบิวต์ขององค์ประกอบ |
| element .firstChild | ส่งคืนโหนดลูกคนแรกขององค์ประกอบ |
| element .firstElementChild | ส่งคืนองค์ประกอบลูกแรกขององค์ประกอบ |
| element focus() | ให้โฟกัสไปที่องค์ประกอบ |
| element getAttribute() | ส่งกลับ specified ค่าแอตทริบิวต์ของโหนดองค์ประกอบ |
| element getAttributeNode() | ส่งกลับ specified โหนดแอตทริบิวต์ |
| element getElementsByClassName() | ผลตอบแทนที่ได้คอลเลกชันของทุกองค์ประกอบของเด็กที่มีชื่อชั้นที่ระบุ |
| element getElementsByTagName() | ผลตอบแทนที่ได้คอลเลกชันของทุกองค์ประกอบของเด็กที่มีชื่อแท็กระบุ |
| element getFeature() | ส่งคืนวัตถุซึ่งดำเนิน APIs ของคุณลักษณะที่ระบุ |
| element hasAttribute() | ผลตอบแทนจริงถ้าเป็นองค์ประกอบที่มี specified แอตทริบิวต์เท็จอย่างอื่น |
| element hasAttributes() | ผลตอบแทนจริงถ้าเป็นองค์ประกอบที่มีแอตทริบิวต์ใด ๆ ที่ผิดพลาดเป็นอย่างอื่น |
| element hasChildNodes() | ผลตอบแทนจริงถ้าองค์ประกอบมีโหนดลูกใด ๆ ที่ผิดพลาดเป็นอย่างอื่น |
| element .id | ตั้งค่าหรือผลตอบแทนที่คุ้มค่าของ id แอตทริบิวต์ขององค์ประกอบ |
| element .innerHTML | ตั้งค่าหรือผลตอบแทนที่เนื้อหาของธาตุนั้น |
| element insertBefore() | แทรกโหนดเด็กใหม่ก่อนกำหนดที่มีอยู่โหนดเด็ก |
| element .isContentEditable | ผลตอบแทนจริงหากเนื้อหาขององค์ประกอบนั้นสามารถแก้ไขเท็จอย่างอื่น |
| element isDefaultNamespace() | ผลตอบแทนจริงถ้าระบุ namespaceURI เป็นค่าเริ่มต้นเป็นเท็จอย่างอื่น |
| element isEqualNode() | ตรวจสอบว่าสององค์ประกอบที่มีค่าเท่ากัน |
| element isSameNode() | ตรวจสอบว่ามีสององค์ประกอบโหนดเดียวกัน |
| element isSupported() | ผลตอบแทนจริงถ้าเป็นคุณลักษณะที่ระบุได้รับการสนับสนุนในองค์ประกอบ |
| element .lang | ตั้งค่าหรือผลตอบแทนที่คุ้มค่าของ lang แอตทริบิวต์ขององค์ประกอบ |
| element .lastChild | ส่งคืนเด็กโหนดสุดท้ายขององค์ประกอบ |
| element .lastElementChild | ส่งคืนองค์ประกอบลูกสุดท้ายขององค์ประกอบ |
| element .namespaceURI | ส่งคืน namespace URI ขององค์ประกอบ |
| element .nextSibling | โหนดกลับถัดไปที่ระดับโหนดต้นไม้เดียวกัน |
| element .nextElementSibling | ส่งกลับองค์ประกอบถัดไปที่ระดับโหนดต้นไม้เดียวกัน |
| element .nodeName | ผลตอบแทนที่ได้ชื่อของโหนด |
| element .nodeType | ส่งคืนประเภทโหนดของโหนด |
| element .nodeValue | ตั้งค่าหรือผลตอบแทนที่คุ้มค่าของโหนด |
| element normalize() | ร่วมโหนดข้อความที่อยู่ติดกันและลบโหนดข้อความว่างเปล่าในองค์ประกอบ |
| element .offsetHeight | ผลตอบแทนที่สูงขององค์ประกอบรวมทั้งการขยายพรมแดนและเลื่อน |
| element .offsetWidth | ส่งกลับความกว้างขององค์ประกอบรวมทั้งการขยายพรมแดนและเลื่อน |
| element .offsetLeft | ส่งคืนตำแหน่งชดเชยแนวนอนขององค์ประกอบ |
| element .offsetParent | ส่งกลับภาชนะ offset ขององค์ประกอบ |
| element .offsetTop | ส่งคืนตำแหน่งชดเชยในแนวตั้งขององค์ประกอบ |
| element .ownerDocument | ส่งกลับองค์ประกอบราก (document object) สำหรับองค์ประกอบ |
| element .parentNode | ส่งคืนโหนดแม่ขององค์ประกอบ |
| element .parentElement | ส่งคืนโหนดองค์ประกอบหลักขององค์ประกอบ |
| element .previousSibling | ส่งคืนโหนดก่อนหน้านี้ที่ระดับโหนดต้นไม้เดียวกัน |
| element .previousElementSibling | ส่งกลับองค์ประกอบก่อนหน้านี้ที่ระดับโหนดต้นไม้เดียวกัน |
| element querySelector() | ส่งกลับองค์ประกอบลูกคนแรกที่ตรงกับ CSS ระบุ selector(s) ขององค์ประกอบ |
| ธาตุ querySelectorAll() | ส่งกลับองค์ประกอบของเด็กทั้งหมดที่ตรงกับ CSS ระบุ selector(s) ขององค์ประกอบ |
| element removeAttribute() | ลบแอตทริบิวต์ที่ระบุจากองค์ประกอบ |
| element removeAttributeNode() | ลบโหนดแอตทริบิวต์ที่กำหนดและผลตอบแทนโหนดที่ถูกลบ |
| element removeChild() | เอาเด็กโหนดจากองค์ประกอบ |
| element replaceChild() | แทนที่โหนดเด็กในองค์ประกอบ |
| element removeEventListener() | เอาตัวจัดการเหตุการณ์ที่ได้รับที่แนบมากับ addEventListener() วิธีการ |
| element .scrollHeight | ผลตอบแทนที่ได้ทั้งความสูงขององค์ประกอบรวมทั้งการขยาย |
| element .scrollLeft | ตั้งหรือส่งกลับจำนวนของพิกเซลเนื้อหาองค์ประกอบถูกเลื่อนในแนวนอน |
| element .scrollTop | ตั้งหรือส่งกลับจำนวนของพิกเซลเนื้อหาองค์ประกอบถูกเลื่อนในแนวตั้ง |
| element .scrollWidth | ผลตอบแทนที่ได้ทั้งความกว้างขององค์ประกอบรวมทั้งการขยาย |
| element setAttribute() | ชุดหรือการเปลี่ยนแปลง specified แอตทริบิวต์เป็นค่าที่ระบุ |
| element setAttributeNode() | ชุดหรือการเปลี่ยนแปลง specified โหนดแอตทริบิวต์ |
| element .style | ตั้งค่าหรือผลตอบแทนที่คุ้มค่าของ style แอตทริบิวต์ขององค์ประกอบ |
| element .tabIndex | ชุดหรือผลตอบแทนที่คุ้มค่าของ tabindex แอตทริบิวต์ขององค์ประกอบ |
| element .tagName | ผลตอบแทนที่ได้ชื่อแท็กของธาตุนั้น |
| element .textContent | ตั้งหรือส่งกลับเนื้อหาต้นฉบับเดิมของโหนดและลูกหลานของตน |
| element .title | ตั้งค่าหรือผลตอบแทนที่คุ้มค่าของ title แอตทริบิวต์ขององค์ประกอบ |
| element toString() | แปลงองค์ประกอบสตริง |
| nodelist item() | ส่งคืนโหนดที่ดัชนีที่ระบุใน NodeList |
| .length nodelist | ส่งกลับจำนวนของโหนดใน NodeList |