‎‎جاوااسكريپت و عناصر دامJavaScript HTML DOM Nodes -‎

div id="div1">
  <p id="p1">This is a paragraph.</p>
  <p id="p2">This is another paragraph.</p>
</div>

<script>
const para = document.createElement("p");
const node = document.createTextNode("This is new.");
para.appendChild(node);

const element = document.getElementById("div1");
element.appendChild(para);
</script >

const para = document.createElement("p");

const node = document.createTextNode("This is a new paragraph.");

para.appendChild(node);

const element = document.getElementById("div1");

element.appendChild(para);

<div id="div1">
  <p id="p1">This is a paragraph.</p>
  <p id="p2">This is another paragraph.</p>
</div>

<script>
const para = document.createElement("p");
const node = document.createTextNode("This is new.");
para.appendChild(node);

const element = document.getElementById("div1");
const child = document.getElementById("p1");
element.insertBefore(para, child);
</script >

<div>
  <p id="p1">This is a paragraph.</p>
  <p id="p2">This is another paragraph.</p>
</div>

<script>
const elmnt = document.getElementById("p1"); elmnt.remove();
</script >

<div id="div1">
  <p id="p1">This is a paragraph.</p>
  <p id="p2">This is another paragraph.</p>
</div>

const elmnt = document.getElementById("p1");

elmnt.remove();

‎متد‎‎remove( )‎‎ در مرورگرهاي قديمي كار نميكند، به مثال زير در مورد ‎نحوه استفاده از‎‎removeChild( )‎‎ بجاي آن توجه نمائيد .

<div id="div1">
  <p id="p1">This is a paragraph.</p>
  <p id="p2">This is another paragraph.</p>
</div>

<script>
const parent = document.getElementById("div1");
const child = document.getElementById("p1");
parent.removeChild(child);
</script >

<div id="div1">
  <p id="p1">This is a paragraph.</p>
  <p id="p2">This is another paragraph.</p>
</div>

const parent = document.getElementById("div1");

const child = document.getElementById("p1");

parent.removeChild(child);

const child = document.getElementById("p1");
child.parentNode.removeChild(child);

<div id="div1">
  <p id="p1">This is a paragraph.</p>
  <p id="p2">This is another paragraph.</p>
</div>

<script>
const para = document.createElement("p");
const node = document.createTextNode("This is new.");
para.appendChild(node);

const parent = document.getElementById("div1");
const child = document.getElementById("p1");
parent.replaceChild(para, child);
</script >