编程 Javascript

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

- Author -

上大王

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

js异步加载的三种解决方案

Mar 04 Javascript

jQuery实现异步获取json数据的2种方式

Aug 29 Javascript

总结JavaScript中布尔操作符||与&&的使用技巧

Nov 17 Javascript

简介EasyUI datagrid editor combogrid搜索框的实现

Apr 01 Javascript

Jquery Easyui分割按钮组件SplitButton使用详解（17）

Dec 18 Javascript

Vue关于数据绑定出错解决办法

May 15 Javascript

ionic2屏幕适配实现适配手机、平板等设备的示例代码

Aug 11 Javascript

详解如何实现一个简单的Node.js脚手架

Dec 04 Javascript

细说webpack源码之compile流程-rules参数处理技巧(1)

Dec 26 Javascript

Django模板继承 extend标签实例代码详解

May 16 Javascript

小程序分享链接onShareAppMessage的具体用法

May 22 Javascript

vue3语法糖内的defineProps及defineEmits

Apr 14 Vue.js

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开发工具

2015/11/09 PHP

thinkPHP的表达式查询用法详解

2016/09/14 PHP

PHP按一定比例压缩图片的方法

2018/10/12 PHP

YII2.0框架行为（Behavior）深入详解

2019/07/26 PHP

PHP For循环字母A-Z当超过26个字母时输出AA,AB,AC

2020/02/16 PHP

JavaScript 特殊字符

2007/04/05 Javascript

Jquery 动态添加按钮实现代码

2010/05/06 Javascript

javascript动画浅析

2012/08/30 Javascript

js实现拉伸拖动iframe的具体代码

2013/08/03 Javascript

JS 实现Table相同行的单元格自动合并示例代码

2013/08/27 Javascript

Jquery 返回json数据在IE浏览器中提示下载的问题

2014/05/18 Javascript

Node.js 去掉种子(torrent)文件里的邪恶信息

2015/03/27 Javascript

JS实现三级折叠菜单特效，其它级可自动收缩

2015/08/06 Javascript

JS原型、原型链深入理解

2016/02/27 Javascript

基于jQuery实现收缩展开功能

2016/03/18 Javascript

Bootstrap简单表单显示学习笔记

2016/11/15 Javascript

jQuery通过改变input的type属性实现密码显示隐藏切换功能

2017/02/08 Javascript

浅谈Vue.js中的v-on(事件处理)

2017/09/05 Javascript

cnpm加速Angular项目创建的方法

2018/09/07 Javascript

微信小程序实现下拉菜单切换效果

2020/03/30 Javascript

JavaScript实现新年倒计时效果

2018/11/17 Javascript

python抓取网页图片并放到指定文件夹

2014/04/24 Python

Python实现线程状态监测简单示例

2018/03/28 Python

Python 通过调用接口获取公交信息的实例

2018/12/17 Python

对python借助百度云API对评论进行观点抽取的方法详解

2019/02/21 Python

Django 使用easy_thumbnails压缩上传的图片方法

2019/07/26 Python

Python3实现配置文件差异对比脚本

2019/11/18 Python

美国校园市场：OCM

2017/06/08 全球购物

自我评价200字分享

2013/12/17 职场文书

竞争性谈判邀请书

2014/02/06 职场文书

高中学生干部学习的自我评价

2014/02/21 职场文书

绩效工资实施方案

2014/03/15 职场文书

购房协议书

2014/04/11 职场文书

政风行风建设整改方案

2014/10/27 职场文书

经典爱情感言

2015/08/03 职场文书

教你如何使用Python开发一个钉钉群应答机器人

2021/06/21 Python