javascript dom 基本操作小結(jié)
自己平時(shí)可能也會經(jīng)常遇到所以總結(jié)如下：
1，dom元素的創(chuàng)建
2，dom元素的插入
3，dom元素替換
4，dom元素的刪除
首先頁面上有這么些簡單的dom元素
<div id="wrap">
<div id="a">aaaaaaaa</div>
<div id="b">bbbbbbbb</div>
<div id="c">ccccccccc</div>
</div>
接下來我們創(chuàng)建一個(gè)div元素，js代碼：
var div_d = document.createElement('div');
div_d.innerHTML = "dddddddd";
div_d.id = "d";
//這里不用innerText為了避免瀏覽器兼容引發(fā)一些問題；
然后把創(chuàng)建的這個(gè)id為d 的div插到dom元素id為b的div的前面
var div_wrap = document.getElementById('wrap');
var div_b = document.getElementById('b');
div_wrap.insertBefore(div_d,div_b);
如果直接插到id為wrap的子元素后面則可以這樣：
div_wrap.insertBefore(div_d,null);
如果是替換掉div_b則如下：
div_wrap.replaceChild(div_d,div_b);
最后我們刪除指定的一個(gè)元素id為b的div
div_b.parentNode.removeChild(div_b);
或者
document.body.removeChild(div_b);
后續(xù)可能有很多衍生的方法及應(yīng)用這里暫時(shí)不繼續(xù)寫下去了
相關(guān)文章
javascript實(shí)現(xiàn)簡單的可隨機(jī)變色網(wǎng)頁計(jì)算器示例
這篇文章主要介紹了javascript實(shí)現(xiàn)簡單的可隨機(jī)變色網(wǎng)頁計(jì)算器,具有基本的四則運(yùn)算與背景色隨機(jī)變換功能,需要的朋友可以參考下2016-12-12
JavaScript設(shè)計(jì)模式策略模式案例分享
這篇文章主要介紹了JavaScript設(shè)計(jì)模式策略模式案例分享，策略設(shè)計(jì)模式就是指一個(gè)問題匹配多個(gè)解決方法，不一定要用到哪一個(gè)，而且有可能隨時(shí)增加多個(gè)方案2022-06-06
這篇文章主要介紹了判斷文件是否正在被使用的JS代碼，有需要的朋友可以參考一下2013-12-12
這篇文章主要介紹了JS給超鏈接加確認(rèn)對話框的方法,涉及javascript操作對話框的技巧,需要的朋友可以參考下2015-02-02
基于javascript實(shí)現(xiàn)日歷功能原理及代碼實(shí)例
這篇文章主要介紹了基于javascript實(shí)現(xiàn)日歷效果原理及代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-05-05
在移動端，側(cè)滑菜單是一個(gè)很常用的組件，本文就詳細(xì)的介紹小程序原生實(shí)現(xiàn)左滑抽屜菜單，具有一定的參考價(jià)值，感興趣的可以了解一下2021-07-07
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)抽獎器效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-10-10
在小程序的開發(fā)中，可能起點(diǎn)就是用戶的登錄與注冊了。和粉絲的互動過程中發(fā)現(xiàn)，對于用戶的登錄注冊還是沒有徹底掌握。我們本篇就來分析一下登錄與注冊如何實(shí)現(xiàn)2022-08-08
ES6的函數(shù)rest參數(shù)使用小結(jié)
這篇文章主要介紹了ES6的函數(shù)rest參數(shù)用法,通過一個(gè)rest參數(shù)代替arguments變量的例子,對ES6?rest參數(shù)用法講解的非常詳細(xì),需要的朋友可以參考下2023-08-08
這篇文章主要介紹了ES6基礎(chǔ)之字符串和函數(shù)的拓展,結(jié)合實(shí)例形式分析了ES6字符串與函數(shù)擴(kuò)展的相關(guān)操作技巧與注意事項(xiàng),需要的朋友可以參考下2019-08-08