ล่าสุดการพัฒนาเว็บบทเรียน
×

JavaScript การอ้างอิง

ภาพรวม

JavaScript

JS เชือก JS จำนวน JS ผู้ประกอบการ JS งบ JS คณิตศาสตร์ JS วันที่ JS แถว JS บูลีน JS นิพจน์ทั่วไป JS สถานการณ์โดยรวม JS การแปลง

เบราว์เซอร์ BOM

Window Navigator Screen History Location

HTML DOM

DOM เอกสาร DOM องค์ประกอบ DOM แอตทริบิวต์ DOM เหตุการณ์ DOM รูปแบบ

HTML วัตถุ

<a> <abbr> <address> <area> <article> <aside> <audio> <b> <base> <bdo> <blockquote> <body> <br> <button> <canvas> <caption> <cite> <code> <col> <colgroup> <datalist> <dd> <del> <details> <dfn> <dialog> <div> <dl> <dt> <em> <embed> <fieldset> <figcaption> <figure> <footer> <form> <head> <header> <h1> - <h6> <hr> <html> <i> <iframe> <img> <ins> <input> button <input> checkbox <input> color <input> date <input> datetime <input> datetime-local <input> email <input> file <input> hidden <input> image <input> month <input> number <input> password <input> radio <input> range <input> reset <input> search <input> submit <input> text <input> time <input> url <input> week <kbd> <keygen> <label> <legend> <li> <link> <map> <mark> <menu> <menuitem> <meta> <meter> <nav> <object> <ol> <optgroup> <option> <output> <p> <param> <pre> <progress> <q> <s> <samp> <script> <section> <select> <small> <source> <span> <strong> <style> <sub> <summary> <sup> <table> <td> <th> <tr> <textarea> <time> <title> <track> <u> <ul> <var> <video>

วัตถุอื่น ๆ

CSSStyleDeclaration


 

HTML DOM length Propery

<ธาตุวัตถุ

ตัวอย่าง

หาวิธีหลาย <p> องค์ประกอบที่มีอยู่ในเอกสาร:

var nodelist = document.getElementsByTagName("P").length;

ผลจากการ nodelist จะเป็น:

4
ลองตัวเอง»

เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง


ความหมายและการใช้งาน

คุณสมบัติความยาวผลตอบแทนจำนวนโหนดในวัตถุ NodeList

คอลเลกชันโหนดวัตถุของโหนดลูกเป็นตัวอย่างของวัตถุ NodeList

คุณสมบัติความยาวจะเป็นประโยชน์เมื่อคุณต้องการที่จะห่วงผ่านโหนดในรายการโหนด (See "More Examples" below)

สถานที่แห่งนี้เป็นอ่านอย่างเดียว

เคล็ดลับ: ใช้ item() วิธีการที่จะกลับโหนดที่ดัชนีที่ระบุในวัตถุ NodeList


สนับสนุนเบราว์เซอร์

คุณสมบัติ
length ใช่ ใช่ ใช่ ใช่ ใช่

วากยสัมพันธ์

รายละเอียดทางเทคนิค
กลับค่า: จำนวนคิดเป็นจำนวนโหนดใน nodelist ที่
DOM รุ่น หลักระดับ 1 Nodelist วัตถุ

ตัวอย่าง

ตัวอย่างอื่น ๆ

ตัวอย่าง

หาวิธีหลาย <p> องค์ประกอบที่มีอยู่ภายใน <div> องค์ประกอบ:

var div = document.getElementById("myDIV");           // Get the <div> element with id="myDIV"
var nodelist = div.getElementsByTagName("P").length;  // Get the number of <p> elements inside <div>

ผลจากการ nodelist จะเป็น:

3
ลองตัวเอง»

ตัวอย่าง

ห่วงผ่านทั้งหมด <p> องค์ประกอบภายใน <div> องค์ประกอบและเปลี่ยนสีพื้นหลังของแต่ละ <p> :

var div = document.getElementById("myDIV");
var nodelist = div.getElementsByTagName("P");

var i;
for (i = 0; i < nodelist.length; i++) {
    nodelist[i].style.backgroundColor = "red";
}
ลองตัวเอง»

ตัวอย่าง

กลับจำนวนโหนดลูกของ <body> องค์ประกอบ:

var nodelist = document.body.childNodes.length;

ผลจากการ nodelist จะเป็น:

12
ลองตัวเอง»

ตัวอย่าง

ห่วงผ่านโหนดลูกของ <body> และเอาท์พุทชื่อโหนดของแต่ละโหนดเด็ก:

var nodelist = document.body.childNodes;

var txt = "";
var i;
for (i = 0; i < nodelist.length; i++) {
    txt = txt + nodelist[i].nodeName + "<br>";
}

ผลจากการ txt จะเป็น:

#comment
#text
P
#text
BUTTON
#text
P
#text
P
#text
SCRIPT
#text
ลองตัวเอง»

หน้าเว็บที่เกี่ยวข้อง

HTML DOM อ้างอิง: href="met_nodelist_item.html"> nodelist . item() Method href="met_nodelist_item.html"> nodelist . item() Method

HTML DOM อ้างอิง: องค์ประกอบ .childNodes ทรัพย์สิน

HTML DOM อ้างอิง: href="met_element_getelementsbyclassname.html"> element . getElementsByClassName() Method href="met_element_getelementsbyclassname.html"> element . getElementsByClassName() Method

HTML DOM อ้างอิง: href="met_element_getelementsbytagname.html"> element . getElementsByTagName() Method href="met_element_getelementsbytagname.html"> element . getElementsByTagName() Method

HTML DOM อ้างอิง: href="met_element_queryselectorall.html"> element . querySelectorAll() Method href="met_element_queryselectorall.html"> element . querySelectorAll() Method

HTML DOM อ้างอิง: href="met_document_getelementsbyclassname.html">document. getElementsByClassName() Method href="met_document_getelementsbyclassname.html">document. getElementsByClassName() Method

HTML DOM อ้างอิง: href="met_doc_getelementsbyname.html">document. getElementsByName() Method href="met_doc_getelementsbyname.html">document. getElementsByName() Method

HTML DOM อ้างอิง: href="met_document_getelementsbytagname.html">document. getElementsByTagName() Method href="met_document_getelementsbytagname.html">document. getElementsByTagName() Method

HTML DOM อ้างอิง: href="met_document_queryselectorall.html">document. querySelectorAll() Method href="met_document_queryselectorall.html">document. querySelectorAll() Method


<ธาตุวัตถุ