快捷導(dǎo)航

原生js實(shí)現(xiàn)給指定元素的后面追加內(nèi)容

更新時(shí)間：2013年04月10日 16:20:50 作者：

給指定元素的后面追加一些自己想要實(shí)現(xiàn)的效果或者是一些屬性之類的，有木有遇到過，接下來為大家詳細(xì)介紹下追加的實(shí)現(xiàn)代碼，感興趣的朋友可以參考下哈

 
var header1 = document.getElementById("header"); 
var p = document.createElement("p"); // 創(chuàng)建一個元素節(jié)點(diǎn) 
insertAfter(p,header1); // 因?yàn)閖s沒有直接追加到指定元素后面的方法 所以要自己創(chuàng)建一個方法 
function insertAfter( newElement, targetElement ){ // newElement是要追加的元素 targetElement 是指定元素的位置 
var parent = targetElement.parentNode; // 找到指定元素的父節(jié)點(diǎn) 
if( parent.lastChild == targetElement ){ // 判斷指定元素的是否是節(jié)點(diǎn)中的最后一個位置 如果是的話就直接使用appendChild方法 
parent.appendChild( newElement, targetElement ); 
}else{ 
parent.insertBefore( newElement, targetElement.nextSibling ); 
}; 
}; 

您可能感興趣的文章:

相關(guān)文章

ES6使用Set數(shù)據(jù)結(jié)構(gòu)實(shí)現(xiàn)數(shù)組的交集、并集、差集功能示例
這篇文章主要介紹了ES6使用Set數(shù)據(jù)結(jié)構(gòu)實(shí)現(xiàn)數(shù)組的交集、并集、差集功能,結(jié)合實(shí)例形式分析了ES6中Set數(shù)據(jù)結(jié)構(gòu)的相關(guān)函數(shù)與實(shí)現(xiàn)數(shù)組交集、并集、差集的相關(guān)操作技巧,需要的朋友可以參考下
2017-10-10
JavaScript效率調(diào)優(yōu)經(jīng)驗(yàn)
有時(shí)候大家在使用多字符的時(shí)候，需要用的到下面的知識。
2009-06-06
關(guān)于自定義Egg.js的請求級別日志詳解
這篇文章主要給大家介紹了關(guān)于自定義Egg.js的請求級別日志的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2018-12-12
javascript順序加載圖片的方法
這篇文章主要介紹了javascript順序加載圖片的方法,可實(shí)現(xiàn)javascript針對圖片的逐次加載,從而減緩服務(wù)器壓力,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
2015-07-07
利用JS屏蔽頁面中的Enter按鍵提交表單的方法
下面小編就為大家?guī)硪黄肑S屏蔽頁面中的Enter按鍵提交表單的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-11-11
Javascript合并表格中具有相同內(nèi)容單元格示例
表格相同內(nèi)容單元格的合并在以前也有過類似的教程，本文為大家講解的是使用Javascript合并，具體示例及效果圖如下，感興趣的朋友可以參考下
2013-08-08
JavaScript深入介紹WebAPI的用法
JS分成三個大的部分：ECMAScript、DOM API、BOM API，其中：ECMAScript是讓前端開發(fā)建立基本的編程思維。但是要想真正來寫一個更加復(fù)雜的有交互式的頁面,還需要WebAPI的支持，相當(dāng)于把后端編程實(shí)現(xiàn)成前端交互。DOM+BOM就組成了WebAPI
2022-06-06
js文字滾動停頓效果代碼
javascript文字滾動停頓效果的實(shí)現(xiàn)代碼
2008-06-06
js Object2String方便查看js對象內(nèi)容
這篇文章主要介紹了將JS的任意對象輸出為json格式字符串的方法,需要的朋友可以參考下
2014-11-11
深入理解JavaScript系列（14）作用域鏈介紹(Scope Chain)
在第12章關(guān)于變量對象的描述中，我們已經(jīng)知道一個執(zhí)行上下文的數(shù)據(jù)（變量、函數(shù)聲明和函數(shù)的形參）作為屬性存儲在變量對象中
2012-04-04