در این پست قصد داریم در مورد چهار روش دیگر صحبت کنیم که به شما در دستکاری آن کمک می کند DOM.
تعداد زیادی روش/ویژگی وجود دارد که به شما در دستکاری آن کمک می کند DOM. همه آنها ذکر نشده است، بلکه تنها موارد مهم یا رایج مورد استفاده قرار می گیرند.
پیش انداختن
را prepend() متد گروهی از اشیاء Node یا اشیاء DOMString را قبل از اولین فرزند گره والد قرار می دهد.
<ul id="list">
<li>first item</li>
<li>second item</li>
<li>third item</li>
</ul>
const list = document.getElementById("list");
const item = document.createElement("li");
item.textContent = "fourth item";
list.prepend(item);
همانطور که می بینید، عنصری که با استفاده از جاوا اسکریپت ایجاد کردیم قبل از اولین فرزند آن لیست قرار می گیرد.
ضمیمه
را append() متد تعدادی از اشیاء Node یا اشیاء DOMString را بعد از فرزند نهایی گره والد وارد می کند.
<ul id="list">
<li>first item</li>
<li>second item</li>
<li>third item</li>
</ul>
const list = document.getElementById("list");
const item = document.createElement("li");
item.textContent = "fourth item";
list.append(item);
جایگزین کودک
را replaceChild() روش برای جایگزینی فرزند یک گره والد استفاده می شود.
نحو
parentNode.replaceChild(newChild, oldChild);
با استفاده از مثال بالا، اولین مورد از لیست را جایگزین می کنیم.
<ul id="list">
<li>first item</li>
<li>second item</li>
<li>third item</li>
</ul>
const list = document.getElementById("list");
const item = document.createElement("li");
item.textContent = "new child item";
list.replaceChild(item, list.firstElementChild);
removeChild
را removeChild() روش برای حذف یک عنصر فرزند از یک گره استفاده می شود.
نحو
parentNode.removeChild(childNode);
با استفاده از همین مثال، اولین عنصر را در لیست نامرتب حذف می کنیم.
<ul id="list">
<li>first item</li>
<li>second item</li>
<li>third item</li>
</ul>
const list = document.getElementById("list");
list.removeChild(list.firstElementChild);
