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 相关文章推荐
JS的递增/递减运算符和带操作的赋值运算符的等价式
Dec 08 Javascript
20款超赞的jQuery插件 Web开发人员必备
Feb 26 Javascript
JavaScript DSL 流畅接口(使用链式调用)实例
Mar 15 Javascript
跟我学习javascript的最新标准ES6
Nov 20 Javascript
jQuery Dialog对话框事件用法实例分析
May 10 Javascript
jQuery通过deferred对象管理ajax异步
May 20 Javascript
浅谈jQuery操作类数组的工具方法
Dec 23 Javascript
安装Node.js并启动本地服务的操作教程
May 12 Javascript
vue 标签属性数据绑定和拼接的实现方法
May 17 Javascript
vue配置接口域名方法总结
May 12 Javascript
JavaScript箭头函数中的this详解
Jun 19 Javascript
JS判断数组四种实现方法详解
Jun 29 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
全国FM电台频率大全 - 13 福建省
2020/03/11 无线电
给初学PHP的5个入手程序
2006/11/23 PHP
php笔记之:php函数range() round()和list()的使用说明
2013/04/26 PHP
php 中文字符串首字母的获取函数分享
2013/11/04 PHP
php安装php_rar扩展实现rar文件读取和解压的方法
2016/11/17 PHP
PHP 进程池与轮询调度算法实现多任务的示例代码
2019/11/26 PHP
Centos7.7 64位利用本地完整安装包安装lnmp/lamp套件教程
2021/03/09 Servers
js控制框架刷新
2008/08/01 Javascript
uploadify在Firefox下丢失session问题的解决方法
2013/08/07 Javascript
Javascript中封装window.open解决不兼容问题
2014/09/28 Javascript
Javascript中的作用域和上下文深入理解
2015/07/03 Javascript
在ASP.NET MVC项目中使用RequireJS库的用法示例
2016/02/15 Javascript
js获取页面及个元素高度、宽度的代码
2016/04/26 Javascript
使用jQuery判断浏览器滚动条位置的方法
2016/05/30 Javascript
超详细的JS弹出窗口代码大全
2020/04/18 Javascript
JavaScript校验Number(4,1)格式的数字实例代码
2017/03/13 Javascript
React-router v4 路由配置方法小结
2017/08/08 Javascript
快速解决layui弹窗按enter键不停弹窗的问题
2019/09/18 Javascript
maptalks+three.js+vue webpack实现二维地图上贴三维模型操作
2020/08/10 Javascript
Python脚本实现Web漏洞扫描工具
2016/10/25 Python
Django 自动生成api接口文档教程
2019/11/19 Python
python实现音乐播放和下载小程序功能
2020/04/26 Python
python使用matplotlib绘制折线图的示例代码
2020/09/22 Python
基于HTML5 的人脸识别活体认证的实现方法
2016/06/22 HTML / CSS
使用phonegap进行提示操作的具体方法
2017/03/30 HTML / CSS
优衣库美国官网:UNIQLO美国
2018/04/14 全球购物
英国皇家造币厂:The Royal Mint
2018/10/05 全球购物
教师业务学习制度
2014/01/25 职场文书
运动会入场解说词
2014/02/07 职场文书
生产助理岗位职责
2014/06/18 职场文书
快递员岗位职责
2014/09/12 职场文书
2015年党务公开工作总结
2015/05/19 职场文书
2015年保险业务员工作总结
2015/05/27 职场文书
虎兄虎弟观后感
2015/06/12 职场文书
小学大队长竞选稿
2015/11/20 职场文书
Win11查看设备管理器
2022/04/19 数码科技