jQuery使用before()和after()在元素前后添加内容的方法

 这篇文章主要介绍了jQuery使用before()和after()在元素前后添加内容的方法,实例分析了jQuery中before()和after()方法添加内容的技巧,非常具有实用价值,需要的朋友可以参考下

 
 

本文实例讲述了jQuery使用before()和after()在元素前后添加内容的方法。分享给大家供大家参考。具体如下:

?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

<!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>

希望本文所述对大家的jQuery程序设计有所帮助。

时间: 2024-09-17 03:36:22

jQuery使用before()和after()在元素前后添加内容的方法的相关文章

jQuery使用before()和after()在元素前后添加内容的方法_jquery

本文实例讲述了jQuery使用before()和after()在元素前后添加内容的方法.分享给大家供大家参考.具体如下: <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#btn1").click(function()

jQuery使用prepend()方法在元素前添加内容用法实例

 这篇文章主要介绍了jQuery使用prepend()方法在元素前添加内容的方法,实例分析了prepend方法追加内容的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了jQuery使用prepend()方法在元素前添加内容的用法.分享给大家供大家参考.具体分析如下: 下面的代码可实现在文本前和列表前添加新的元素 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <!

jQuery使用prepend()方法在元素前添加内容用法实例_jquery

本文实例讲述了jQuery使用prepend()方法在元素前添加内容的用法.分享给大家供大家参考.具体分析如下: 下面的代码可实现在文本前和列表前添加新的元素 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#btn1"

jQuery实现点击表格单元格就可以编辑内容的方法【测试可用】_jquery

本文实例讲述了jQuery实现点击表格单元格就可以编辑内容的方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/

jQuery+php实时获取及响应文本框输入内容的方法_jquery

本文实例讲述了jQuery+php实时获取及响应文本框输入内容的方法.分享给大家供大家参考,具体如下: 该程序能够查出可用余额: HTML部分: <input type="text" name="username" id="username" onkeyup="search_func(this.value);" /> <em id="mfee"></em> jquery部

JS数组array元素的添加和删除方法代码实例_javascript技巧

js数组元素的添加和删除一直比较迷惑,今天终于找到详细说明的资料了,先给个我测试的代码^-^ var arr = new Array(); arr[0] = "aaa"; arr[1] = "bbb"; arr[2] = "ccc"; //alert(arr.length);//3 arr.pop(); //alert(arr.length);//2 //alert(arr[arr.length-1]);//bbb arr.pop(); //al

jQuery使用after()方法在元素后面添加多项内容的方法

 这篇文章主要介绍了jQuery使用after()方法在元素后面添加多项内容的方法,实例分析了jQuery中after方法的功能及在元素后面添加内容的技巧,非常具有实用价值,需要的朋友可以参考下     本文实例讲述了jQuery使用after()方法在元素后面添加多项内容的方法.分享给大家供大家参考.具体分析如下: jQuery可通过after()方法在元素后面添加多项内容,after()可以带多个参数,在指定元素后面添加多项内容 ? 1 2 3 4 5 6 7 8 9 10 11 12 13

《jQuery、jQuery UI及jQuery Mobile技巧与示例》——3.6 技巧:使用append()和appendTo()添加内容

3.6 技巧:使用append()和appendTo()添加内容 html()方法会替换元素的当前内容,因此将由你负责维护当前元素的内容.代码清单3-6演示了如何使用append()和appendTo()添加元素而不影响元素的当前内容. 代码清单3-6 演示append()和appendTo()之间的区别 00 <!DOCTYPE html> 01 02 <html lang="en"> 03 <head> 04 <title>Diffe

jQuery设置指定网页元素宽度和高度的方法

 这篇文章主要介绍了jQuery设置指定网页元素宽度和高度的方法,涉及jQuery操作width及height方法的技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了jQuery设置指定网页元素宽度和高度的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 <!DOCTYPE html> <html> <head> <script src=&