快捷導(dǎo)航

jQuery使用before()和after()在元素前后添加內(nèi)容的方法

更新時(shí)間：2015年03月26日 14:29:59 作者：上大王

這篇文章主要介紹了jQuery使用before()和after()在元素前后添加內(nèi)容的方法,實(shí)例分析了jQuery中before()和after()方法添加內(nèi)容的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了jQuery使用before()和after()在元素前后添加內(nèi)容的方法。分享給大家供大家參考。具體如下：

<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
 $("#btn1").click(function(){
  $("img").before("<b>Before</b>");
 });
 $("#btn2").click(function(){
  $("img").after("<i>After</i>");
 });
});
</script>
</head>
<body>
<img src="/images/w3jquery.gif" alt="jQuery" width="100" height="140">
<br><br>
<button id="btn1">Insert before</button>
<button id="btn2">Insert after</button>
</body>
</html>

希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

jQuery根據(jù)用戶電腦是mac還是pc加載對(duì)應(yīng)樣式的方法
這篇文章主要介紹了jQuery根據(jù)用戶電腦是mac還是pc加載對(duì)應(yīng)樣式的方法,涉及jQuery針對(duì)客戶端信息的獲取及樣式的調(diào)用技巧,需要的朋友可以參考下
2015-06-06
jQuery中$.fn的用法示例介紹
$.fn是指jquery的命名空間，加上fn上的方法及屬性，會(huì)對(duì)jquery實(shí)例每一個(gè)有效，下面有個(gè)不錯(cuò)的示例，喜歡的朋友可以參考下
2013-11-11
下拉列表選擇項(xiàng)的選中在不同瀏覽器中的兼容性問(wèn)題探討
使用jquery做了一個(gè)項(xiàng)目，下拉列表選擇項(xiàng)變化時(shí)，獲取選中項(xiàng)的文本在不同瀏覽器中的兼容性問(wèn)題在本文將為大家介紹下
2013-09-09
JQuery Dialog對(duì)話框不能通過(guò)Esc關(guān)閉的原因分析及解決辦法
這篇文章主要介紹了JQuery Dialog對(duì)話框不能通過(guò)Esc關(guān)閉的原因分析及解決辦法,需要的朋友可以參考下
2017-01-01
jQuery中l(wèi)ast()方法用法實(shí)例
這篇文章主要介紹了jQuery中l(wèi)ast()方法用法,實(shí)例分析了last()方法獲取匹配元素集合中的最后一個(gè)元素時(shí)的使用技巧,需要的朋友可以參考下
2015-01-01
在線引用最新jquery文件的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇在線引用最新jquery文件的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-08-08
jquery select插件異步實(shí)時(shí)搜索實(shí)例代碼
這篇文章主要介紹了jquery select插件異步實(shí)時(shí)搜索實(shí)例代碼,需要的朋友可以參考下
2017-10-10
jQuery Easyui datagrid連續(xù)發(fā)送兩次請(qǐng)求問(wèn)題
用上述方式動(dòng)態(tài)加載datagrid的數(shù)據(jù)時(shí)，通過(guò)net監(jiān)聽(tīng)，發(fā)現(xiàn)調(diào)用了兩遍XX方法，目前的解決方案是，將url放到datagrid初始化的時(shí)候執(zhí)行
2016-12-12
Jquery實(shí)現(xiàn)簡(jiǎn)單的輪播效果(代碼管用)
這篇文章主要介紹了Jquery實(shí)現(xiàn)簡(jiǎn)單的輪播效果(代碼管用) 的相關(guān)資料,需要的朋友可以參考下
2016-03-03
Jquery 獲取checkbox的checked問(wèn)題
這個(gè)郁悶了，今天寫(xiě)這個(gè)功能的時(shí)候發(fā)現(xiàn)了問(wèn)題，上網(wǎng)找了好多資料對(duì)照，更加糾結(jié)
2011-11-11