HTML DOM Element getElementsByClassName() နည်းလမ်း

ဒါနှင့် အသုံးပြုခြင်း နှင့် အသုံးပြုခြင်း

getElementsByClassName() နည်းလမ်း ပါဝင်သော နည်းလမ်း ကို ပြန်လည်ရယူသည်၍ ပေါ်ပေါ်တူညီသော အစုအဝေးအရာအထွေားကို ပြန်လည်ရယူသည်

ပြင်ပဖော်ပြချက်

classList အရာအထွေား

className အရာအထွေား

querySelector() နည်းလမ်း

querySelectorAll() နည်းလမ်း

getElementsByTagName() နည်းလမ်း

HTML DOM Style အပေါင်း

အခြေခံအညွှန်း

CSS အပိုင်းအလိုက်

CSS ရှာဖွေကြရသော

CSS ရှာဖွေကြရသော ဆိုင်းလုံး

NodeList

NodeList အစုအဝေးအရာအထွေား တူညီသော အစုအဝေး (အစုအဝေးကြီး)

သင့်များ အစုအဝေးအရာအထွေား ကို နံပါတ်ဖြင့် ဝင်ရောက်ရမည်၍ နံပါတ်မှာ 0 ဖြင့် စတင်သည်

length အရာအထွေားအစုအဝေးအရာအထွေားကို ကြန့်မှန်း

အမှတ်

အမှတ် 1 သုံး

class="child" ဖောင်းအရ ပထမကြိမ်သင့်များအစုအဝေးကြီးကို လုပ်သုံး

const list = document.getElementsByClassName("example")[0];
list.getElementsByClassName("child")[0].innerHTML = "Milk";

ကိုယ်တိုင် စမ်းသပ်ပါ

အမှတ် 2 သုံး

"myDIV" အရ class="child" အစုအဝေးများ အရာအထွေား

const element = document.getElementById("myDIV");
const nodes = element.getElementsByClassName("child");
let number = nodes.length;

ကိုယ်တိုင် စမ်းသပ်ပါ

အမှတ် 3 သုံး

ပြောင်းရန် class="child" ဖောင်း၏ ဒုတိယအစုအဝေးကြီးပိုမိုလိုက်လျောမှု

const element = document.getElementById("myDIV");
element.getElementsByClassName("child")[1].style.fontSize = 24px

ကိုယ်တိုင် စမ်းသပ်ပါ

အမှတ် 4

class="example" ကို အသုံးပြုသော ဒုတိယ အချက်အလက် တွင် "child" နှင့် "color" အချက်အလက် အသုံးပြုပါ

const elements = document.getElementsByClassName("example")[1];
elements.getElementsByClassName("child color")[0].style.fontSize = "24px";

ကိုယ်တိုင် စမ်းသပ်ပါ

အမှတ် 5

ကိရိယာ "myDIV" အတွက် class="child" အချက်အလက် ရှိသော အချက်အလက်များ အကြောင်း အော်လင်းပါ

const element = document.getElementById("myDIV");
const nodes = element.getElementsByClassName("child");
for (let i = 0; i < nodes.length; i++) {
  nodes[i].style.color = "red";
}

ကိုယ်တိုင် စမ်းသပ်ပါ

ပြုအပ်ခြင်း

element.getElementsByClassName(classname)

ပါအချက်

ပါအချက် ဖော်ပြ
classname

တစ်ခုတည်းသော လိုအပ်ချက်။ လျှပ်ပျော့ အရာဝတ္တု အမျိုးအစား

အမျိုးအစား အများကို အားကစားအားဖြင့် သုံးပါ (ဥပမာ "child color" ကဲ့သို့)

ပြန်လည်သတင်း

အမျိုးအစား ဖော်ပြ
NodeList

အခြေခံ အမျိုးအစား အပါအဝင် ရှိသော အရာဝတ္တု အချက်အလက်များနှင့် မပါဘဲ။

အရာဝတ္တု ကို သတ်မှတ်ထားသော အရောက် တွင် ပေါ်ထွက်လာသော အမှား အထား အရ စီစဥ်ထားပါတယ်。

ဘရာဇက်ဝါ ထောက်ပံ့

element.getElementsByClassName() ဖြစ်သည် ဒီ ဒီမိုကရက် အချိန် 1 (1998) အခြေခံ။

အားလုံး ဘရာဇက်ဝါ အတွက် အပြည့်အဝျဲ ထောက်ပံ့ထားပါတယ်：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
ထောက်ပံ့ 9-11 ထောက်ပံ့ ထောက်ပံ့ ထောက်ပံ့ ထောက်ပံ့