Latest web development tutorials
×

JavaScript & HTML DOM คู่มืออ้างอิง

ภาพรวม

JavaScript วัตถุ

JavaScript Array วัตถุ JavaScript Boolean วัตถุ JavaScript Date วัตถุ JavaScript Math วัตถุ JavaScript Number วัตถุ JavaScript String วัตถุ JavaScript RegExp วัตถุ JavaScript อสังหาริมทรัพย์ทั่วโลก / ฟังก์ชั่น JavaScript ผู้ประกอบการ

Browser วัตถุ

Window วัตถุ Navigator วัตถุ Screen วัตถุ History วัตถุ Location วัตถุ

DOM วัตถุ

HTML DOM Document วัตถุ HTML DOM วัตถุธาตุ HTML DOM แอตทริบิวต์วัตถุ HTML DOM วัตถุที่จัดกิจกรรม

HTML วัตถุ

<a> <area> <audio> <base> <blockquote> <body> <button> <canvas> <col> <colgroup> <datalist> <del> <details> <dialog> <embed> <fieldset> <form> <iframe> <frameset > <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> - range <input> - password <input> - radio <input> - reset <input> - search <input> - submit <input> - text <input> - time <input> - url <input> - week <keygen> <link> <label> <legend> <li> <map> <menu> <menuItem> <meta> <meter> <object> <ol> <optgroup> <option> <param> <progress> <q> <script> <select> <source> <style> <table> <td> <th> <tr> <textarea> <title> <time> <track> <video>

HTML DOM getElementsByClassName () วิธีการ

อ้างอิงวัตถุเอกสาร วัตถุเอกสาร

ตัวอย่าง

ได้รับองค์ประกอบทั้งหมดโดยชื่อชั้น:

var x = document.getElementsByClassName ( "ตัวอย่าง" );

ลอง»

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

getElementsByClassName () วิธีการส่งกลับองค์ประกอบทั้งหมดในเอกสารระบุชื่อชั้นของคอลเลกชันที่เป็นวัตถุ NodeList

วัตถุ NodeList หมายถึงการสั่งซื้อรายการโหนด NodeList วัตถุที่เราสามารถเข้าถึงรายชื่อของโหนด (หมายเลขดัชนีเริ่มจาก 0) ผ่านรายการโหนดหมายเลขดัชนีโหนด

เคล็ดลับ: คุณสามารถใช้วัตถุ NodeList ของ ความยาวของ สถานที่ให้บริการในการกำหนดจำนวนขององค์ประกอบโดยชื่อชั้นและองค์ประกอบต่างๆของวงจรที่จะได้รับองค์ประกอบที่คุณต้องการ

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

ตัวเลขในตารางเป็นตัวแทนของเบราว์เซอร์ครั้งแรกเพื่อรองรับจำนวนวิธีรุ่น

ทาง
getElementsByClassName () 4.0 9.0 3.0 3.1 9.5

ไวยากรณ์

document.getElementsByClassName (ClassName)

พารามิเตอร์

พารามิเตอร์ ชนิด ลักษณะ
ClassName เชือก ต้อง เรียนองค์ประกอบที่คุณจำเป็นต้องได้รับชื่อ

ชื่อชั้นหลายคั่นด้วยช่องว่างเช่น "การทดสอบสาธิต"

รายละเอียดทางเทคนิค

รุ่น DOM: ระดับหลัก 1 วัตถุเอกสาร
ผลตอบแทน: วัตถุ NodeList ที่แสดงถึงองค์ประกอบระบุชื่อชั้นของคอลเลกชัน ลำดับขององค์ประกอบในคอลเลกชันของการจัดเรียงของในลำดับการแสดงในรหัส
ตัวอย่าง

ตัวอย่างเพิ่มเติม

ตัวอย่าง

ได้รับ "ตัวอย่าง" และ "สี" ชื่อชั้นขององค์ประกอบทั้งหมด:

var x = document.getElementsByClassName( "example color" );

ลอง»

ตัวอย่าง

วิธีการหลายรูปแบบ class = "เช่น" องค์ประกอบ (โดยใช้ระยะเวลาในทรัพย์สินของ NodeList) เพื่อดูเอกสารที่มี:

var x = document.getElementsByClassName( "example" ).length;

ลอง»

ตัวอย่าง

เปลี่ยนสีพื้นหลังของทุกรูปแบบ class = "เช่น" องค์ประกอบ:

var x = document.getElementsByClassName( "example" );
var i;
for (i = 0 ; i < x.length; i++) {
    x[i].style.backgroundColor = "red" ;
}

ลอง»

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

กวดวิชา CSS: ตัวเลือก CSS

อ้างอิง CSS: ตัวเลือก CSS .class

คู่มือการใช้งาน HTML DOM อ้างอิง: ธาตุ .getElementsByClassName ()

HTML DOM อ้างอิง: className แอตทริบิวต์

คู่มือการใช้งาน HTML DOM อ้างอิง: HTML DOM แอตทริบิวต์ classList

คู่มือการใช้งาน HTML DOM อ้างอิง: HTML DOM สไตล์วัตถุ

อ้างอิงวัตถุเอกสาร วัตถุเอกสาร