㈠ js - 元素節點插入操作總結
在JavaScript中,實現元素中插入節點的操作方法包括insertAdjacentElement、insertAdjacentHTML、insertAdjacentText、innerHTML、appendChild、append和after。這些方法在操作元素時各有特點及適用場景。
insertAdjacentElement、insertAdjacentHTML與insertAdjacentText在插入位置上相似,但操作內容不同。insertAdjacentElement需要插入DOM節點,否則將引發類型錯誤警告。insertAdjacentHTML適用於插入HTML文本信息,解析後形成元素。insertAdjacentText則直接插入文本信息,不進行解析。而innerHTML可設置或獲取HTML語法表示的元素後代,適用於動態更新元素內容。
注意在使用innerText和textContent時,它們分別設置或獲取節點及其後代元素的文本內容。不同之處在於,textContent不僅獲取可見文本,還包含隱藏元素、script標簽內容和style標簽中的內容。
appendChild方法將一個節點附加到指定父節點的子節點列表末尾。若目標節點已存在於文檔樹中,appendChild會將其移動至新位置,而無需先移除節點。append則在Element的最後一個子節點之後插入一組Node或DOMString對象,等價於插入Text節點。與appendChild相比,append不改變節點在DOM樹中的位置。
after方法在目標節點之後插入一組Node或DOMString對象,等價於插入Text節點。此方法提供了一種簡便的元素插入方式,無需關心目標節點的具體位置。這些插入操作方法在實際開發中應根據具體需求靈活選擇,以實現高效、准確的DOM結構管理。
㈡ 向js數組中添加元素的3種方法
1、push() 結尾添加
數組.push(元素)
參數 描述
newelement1必需。 要添加到數組的第一個元素。
newelement2可選。 要添加到數組的第二個元素。
newelementX可選。 可添加多個元素。
2、unshift() 頭部添加
數組.unshift(元素)
參數 描述
newelement1必需。 向數組添加的第一個元素。
newelement2可選。 向數組添加的第二個元素。
newelementX可選。 可添加若干個元素。
3、splice() 方法向/從數組指定位置添加/刪除項目,然後返回被刪除的項目。
參數 描述
index必需。 整數,規定添加/刪除項目的位置,使用負數可從數組結尾處規定位置。
howmany必需。 要刪除的項目數量。如果設置為 0,則不會刪除項目。
item1, ..., itemX可選。 向數組添加的新項目。