Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

JavaScript का उपयोग करके HTML में चाइल्ड नोड कैसे हटाएं?


JavaScript का उपयोग करके HTML में चाइल्ड नोड हटाने का निम्नलिखिक कोड है:

उदाहरण

<!DOCTYPE html> <html lang="hi"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Remove Child Node Demo</title> <style> body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 20px; font-weight: 500; } </style> </head> <body> <h1>JavaScript का उपयोग करके HTML में चाइल्ड नोड हटाएं</h1> <div style="color: green;" class="result"> <ul class="animal"> <li>गाय</li> <li>शेर</li> <li>बाघ</li> <li>भैंस</li> </ul> </div> <button class="Btn">यहाँ क्लिक करें</button> <h3> ऊपर दी गई लिस्ट से पहला लिस्ट एलिमेंट हटाने के लिए बटन पर क्लिक करें </h3> <script> let resEle = document.querySelector(".result"); let animalList = document.querySelector(".animal"); document.querySelector(".Btn").addEventListener("click", () => { animalList.removeChild(animalList.childNodes[0]); animalList = animalList; }); </script> </body> </html>

आउटपुट

उपरोक्त कोड निम्नलिखिक आउटपुट देगा:

JavaScript का उपयोग करके HTML में चाइल्ड नोड कैसे हटाएं?

'यहाँ क्लिक करें' बटन पर क्लिक करने पर:

JavaScript का उपयोग करके HTML में चाइल्ड नोड कैसे हटाएं?


  1. JavaScript में चाइल्ड के innerText के बिना H1 का innerText कैसे प्राप्त करें JavaScript में चाइल्ड के innerText के बिना H1 का innerText कैसे प्राप्त करें

    इसके लिए, आप textContent का उपयोग कर सकते हैं, जैसे:childNodes[0].textContent;उदाहरणकोड निम्न है:<!DOCTYPE html> <html lang=en> <head>    <meta charset=UTF-8>    <meta name=viewport content=width=device-width, initial-scale=1.0>    <titl

  1. JavaScript में ID द्वारा एलिमेंट हटाना JavaScript में ID द्वारा एलिमेंट हटाना

    ID द्वारा एलिमेंट हटाने के लिए, आप remove() का उपयोग कर सकते हैं।उदाहरणकोड निम्न है:<!DOCTYPE html> <html lang=en> <head>    <meta charset=UTF-8>    <meta name=viewport content=width=device-width, initial-scale=1.0>    <title>Document

  1. JavaScript में DOM नोड के सभी चाइल्ड एलिमेंट्स हटाना JavaScript में DOM नोड के सभी चाइल्ड एलिमेंट्स हटाना

    चाइल्ड एलिमेंट्स हटाने के लिए, innerHTML को पर सेट करें।उदाहरणकोड निम्न है:<!DOCTYPE html> <html lang=en> <head>    <meta charset=UTF-8>    <meta name=viewport content=width=device-width, initial-scale=1.0>    <title>Document</tit