HTML DOM Element removeChild() పద్ధతి

నిర్వచనం మరియు ఉపయోగం

removeChild() ఈ పద్ధతి మూలకం యొక్క పిల్లల మూలకాలను తీసివేస్తుంది.

ఈ పద్ధతి తీసివేయబడిన మూలకాన్ని నోడ్ ఆబ్జెక్ట్ తో తిరిగి ఇచ్చేందుకు ఉపయోగిస్తుంది; మూలకం లేకపోయితే, తిరిగి ఇచ్చేందుకు ఉపయోగిస్తుంది null.

అడ్వైజరీ

పిల్లల మూలకాలు డాక్యుమెంట్ ఆబ్జెక్ట్ మోడెల్ (DOM) నుండి తీసివేయబడ్డాయి.

కానీ, తిరిగి DOM లో ప్రవేశపెట్టడానికి తిరిగి నుండి నుండి మూలకాన్ని మార్చవచ్చు (క్రింది ఉదాహరణను చూడండి).

మరింత విచారణ కొరకు చూడండి:

remove() పద్ధతి

appendChild() పద్ధతి

insertBefore() పద్ధతి

replaceChild() పద్ధతి

childNodes అంశం

firstChild అంశం

lastChild అంశం

firstElementChild అంశం

lastElementChild అంశం

ఇన్స్టాన్స్

ఉదాహరణ 1

జాబితా నుండి మొదటి మూలకాన్ని తీసివేయండి:

const list = document.getElementById("myList");
list.removeChild(list.firstElementChild);

తీసివేసిన తర్వాత:

  • కాఫీ
  • కాఫీ
  • తీసివేసిన తర్వాత:

తీసివేయడానికి ముందు:

  • కాఫీ
  • తీసివేసిన తర్వాత:

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 2

జాబితాకు పిల్లల మూలకాలు ఉంటే, మొదటిని (ఇండెక్స్ 0) తీసివేయండి:

const list = document.getElementById("myList");
if (list.hasChildNodes()) {
  list.removeChild(list.children[0]);
}

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 3

జాబితా నుండి అన్ని పిల్లల మూలకాలను తీసివేయండి:

const list = document.getElementById("myList");
while (list.hasChildNodes()) {
  list.removeChild(list.firstChild);
}

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 4

తన ప్రాతిని నుండి ఒక మూలకాన్ని తీసివేయండి:

element.parentNode.removeChild(element);

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 5

తన ప్రాతిని నుండి ఒక మూలకాన్ని తీసివేసి మళ్ళీ ప్రవేశపెట్టండి:

const element = document.getElementById("myLI");
function removeLi() {
  element.parentNode.removeChild(element);
}
function appendLi() {
  const list = document.getElementById("myList");
  list.appendChild(element);
}

స్వయంగా ప్రయత్నించండి

ఉదాహరణ 6: ప్రత్యుత్తరం

తొలగించబడిన నోడ్ ను అదే డాక్యుమెంట్ లోకి ప్రవేశపెట్టడానికి appendChild() లేదా insertBefore() ఉపయోగించండి.

document.adoptNode() లేదా document.importNode() ఉపయోగించి మరొక డాక్యుమెంట్ లోకి ప్రవేశపెట్టవచ్చు.

ఈ ఉదాహరణలో, ఒక ఎలమెంట్ ని తన ప్రాతినిధ్య ఎలమెంట్ నుండి తొలగించి మరొక డాక్యుమెంట్ లోకి ప్రవేశపెట్టబడుతుంది:

const child = document.getElementById("mySpan");
function remove() {
  child.parentNode.removeChild(child);
}
function insert() {
  const frame = document.getElementsByTagName("IFRAME")[0]
  const h = frame.contentWindow.document.getElementsByTagName("H1")[0];
  const x = document.adoptNode(child);
  h.appendChild(x);
}

స్వయంగా ప్రయత్నించండి

సంకేతం

element.removeChild(node)

లేదా

node.removeChild(node)

పరామితి

పరామితి వివరణ
node అవసరం. తొలగించవలసిన నోడ్ (ఎలమెంట్).

తిరిగి వచ్చే విలువ

రకం వివరణ
నోడ్

తొలగించబడిన నోడ్ (ఎలమెంట్).

కుమార నాణ్యం లేకపోతే, null అవుతుంది.

బ్రౌజర్ మద్దతు

element.removeChild() ఇది DOM Level 1 (1998) లక్షణం.

అన్ని బ్రౌజర్లు పూర్తిగా దానిని మద్దతు ఇస్తాయి:

క్రోమ్ ఐఈ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఓపెరా
క్రోమ్ ఐఈ ఎడ్జ్ ఫైర్ఫాక్స్ సఫారీ ఓపెరా
మద్దతు 9-11 మద్దతు మద్దతు మద్దతు మద్దతు