jQuery中insertAfter()方法用法實例
更新時間：2015年01月08日 15:03:59 投稿：shichen2014
這篇文章主要介紹了jQuery中insertAfter()方法用法,實例分析了insertAfter()方法的功能、定義及匹配的元素插入到另一個指定的元素集合后面的使用技巧,需要的朋友可以參考下
本文實例講述了jQuery中insertAfter()方法用法。分享給大家供大家參考。具體分析如下：
此方法把匹配的元素插入到另一個指定的元素集合的后面。
insertAfter()方法與insertBefore()方法的作用相反。
語法結(jié)構(gòu):
復(fù)制代碼 代碼如下:
$(selector).insertAfter(content)
參數(shù)列表:
實例代碼:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.fzitv.net/" />
<title>insertAfter()函數(shù)-腳本之家</title>
<style type="text/css">
p{
width:100px;
height:100px;
border:1px solid red;
}
div{
width:200px;
height:200px;
border:1px solid blue;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("div").insertAfter("p");
})
});
</script>
</head>
<body>
<div>我的前面會被插入內(nèi)容</div>
<p>我是p元素</p>
<button>點擊查看效果</button>
</body>
</html>
以上代碼可以將div元素插入到p元素的下面，當然是外部的下面。
希望本文所述對大家的jQuery程序設(shè)計有所幫助。
相關(guān)文章
jQuery + html + css 實現(xiàn)王者榮耀官網(wǎng)首頁效果&nb
這篇文章主要介紹了jQuery + html + css 實現(xiàn)王者榮耀官網(wǎng)首頁效果，本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2022-02-02
這篇文章主要介紹了jQuery中children()方法用法,實例分析了children()方法的功能、定義及過濾所匹配子元素的使用技巧,需要的朋友可以參考下2015-01-01
這篇文章主要介紹了jquery判斷input值不為空的方法的相關(guān)資料,需要的朋友可以參考下2016-06-06
這篇文章主要介紹了jQuery實現(xiàn)徑向動畫菜單效果的相關(guān)資料,需要的朋友可以參考下2015-07-07
jquery checkbox全選、取消全選實現(xiàn)代碼
jquery實現(xiàn)checkbox全選、取消全選的代碼。2010-03-03
如何沒有任何一個庫可以滿足所有的需求，可以使用JQuery庫提供的擴展功能，下面有個示例，大家可以看看2014-09-09
詳談jQuery unbind 刪除綁定事件 / 移除標簽方法
下面小編就為大家?guī)硪黄斦刯Query unbind 刪除綁定事件 / 移除標簽方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-03-03
這篇文章主要為大家詳細介紹了JQuery實現(xiàn)簡單瀑布流布局，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-07-07
textarea 在瀏覽器中固定大小和禁止拖動的實現(xiàn)方法
下面小編就為大家?guī)硪黄猼extarea 在瀏覽器中固定大小和禁止拖動的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧，祝大家游戲愉快哦2016-12-12
這篇文章主要介紹了jQuery分組選擇器簡單用法,結(jié)合實例形式分析了使用jQuery分組選擇器動態(tài)設(shè)置頁面元素屬性相關(guān)操作技巧,需要的朋友可以參考下2019-04-04