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


Posted in Javascript onMarch 26, 2015

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

<!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程序设计有所帮助。

Javascript 相关文章推荐
用Javascript评估用户输入密码的强度实现代码
Nov 30 Javascript
jQuery在IE下使用未闭合的xml代码创建元素时的Bug介绍
Jan 10 Javascript
document.addEventListener使用介绍
Mar 07 Javascript
alert和confirm功能介绍
May 21 Javascript
常用的js验证和数据处理总结
Aug 02 Javascript
Vue中fragment.js使用方法详解
Mar 09 Javascript
Next.js项目实战踩坑指南(笔记)
Nov 29 Javascript
layui(1.0.9)文件上传upload,前后端的实例代码
Sep 26 Javascript
p5.js实现简单货车运动动画
Oct 23 Javascript
Preload基础使用方法详解
Feb 03 Javascript
JS制作简易计算器的实例代码
Jul 04 Javascript
vue+高德地图实现地图搜索及点击定位操作
Sep 09 Javascript
jQuery使用after()方法在元素后面添加多项内容的方法
Mar 26 #Javascript
jQuery使用empty()方法删除元素及其所有子元素的方法
Mar 26 #Javascript
jquery使用remove()方法删除指定class子元素
Mar 26 #Javascript
jQuery使用removeClass方法删除元素指定Class的方法
Mar 26 #Javascript
jQuery给多个不同元素添加class样式的方法
Mar 26 #Javascript
Js实现自定义右键行为
Mar 26 #Javascript
jQuery使用addClass()方法给元素添加多个class样式
Mar 26 #Javascript
You might like
PHP中对用户身份认证实现两种方法
2011/06/04 PHP
一组PHP加密解密函数分享
2014/06/05 PHP
php截取html字符串及自动补全html标签的方法
2015/01/15 PHP
JS实现切换标签页效果实例代码
2013/11/01 Javascript
在JavaScript中使用对数Math.log()方法的教程
2015/06/15 Javascript
JavaScript实现点击按钮直接打印
2016/01/06 Javascript
jquery模拟实现鼠标指针停止运动事件
2016/01/12 Javascript
巧方法 JavaScript获取超链接的绝对URL地址
2016/06/14 Javascript
javascript和jQuery实现网页实时聊天的ajax长轮询
2016/07/20 Javascript
JS给swf传参数的实现方法
2016/09/13 Javascript
使用微信内嵌H5网页解决JS倒计时失效问题
2017/01/13 Javascript
JavaScript继承定义与用法实践分析
2018/05/28 Javascript
JavaScript引用类型Function实例详解
2018/08/09 Javascript
JS实现点击li标签弹出对应的索引功能【案例】
2019/02/18 Javascript
详解在网页上通过JS实现文本的语音朗读
2019/03/28 Javascript
Vue.js自定义指令学习使用详解
2019/10/19 Javascript
《javascript设计模式》学习笔记一:Javascript面向对象程序设计对象成员的定义分析
2020/04/07 Javascript
javascript前端和后台进行数据交互方法示例
2020/08/07 Javascript
在vue-cli创建的项目中使用sass操作
2020/08/10 Javascript
jquery实现加载更多&quot;转圈圈&quot;效果(示例代码)
2020/11/09 jQuery
[02:36]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Magma 选手采访
2021/03/11 DOTA
Python json模块使用实例
2015/04/11 Python
Python简单调用MySQL存储过程并获得返回值的方法
2015/07/20 Python
git使用.gitignore设置不生效或不起作用问题的解决方法
2017/06/01 Python
Python使用wxPython实现计算器
2018/01/30 Python
解决pyinstaller打包发布后的exe文件打开控制台闪退的问题
2019/06/21 Python
python中自带的三个装饰器的实现
2019/11/08 Python
Html5中的桌面通知Notification的实现
2018/09/25 HTML / CSS
拉斯维加斯城市观光通行证:Las Vegas Pass
2019/05/21 全球购物
销售经理工作职责
2014/02/03 职场文书
打架检讨书2000字
2014/02/22 职场文书
安全生产承诺书
2014/03/26 职场文书
光棍节联谊晚会活动策划书
2014/10/10 职场文书
2014年涉外离婚协议书范本
2014/11/20 职场文书
2016先进工作者事迹材料
2016/02/25 职场文书
2016年幼儿园教师师德承诺书
2016/03/25 职场文书