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


Posted in Javascript onMarch 26, 2015

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

jQuery可通过after()方法在元素后面添加多项内容,after()可以带多个参数,在指定元素后面添加多项内容

<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.min.js">
</script>
<script>
function afterText()
{
var txt1="<b>I </b>"; // Create element with HTML
var txt2=$("<i></i>").text("love "); // Create with jQuery
var txt3=document.createElement("big"); // Create with DOM
txt3.innerHTML="jQuery!";
$("img").after(txt1,txt2,txt3); // Insert new elements after img
}
</script>
</head>
<body>
<img src="/images/w3jquery.gif" alt="jQuery" width="100" height="140">
<br><br>
<button onclick="afterText()">Insert after</button>
</body>
</html>

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

Javascript 相关文章推荐
MooTools 1.2中的Drag.Move来实现拖放
Sep 15 Javascript
jQuery阻止冒泡和HTML默认操作
Nov 17 Javascript
JsRender for object语法简介
Oct 31 Javascript
JSON格式的键盘编码对照表
Jan 29 Javascript
jQuery实现的点赞随机数字显示动画效果(附在线演示与demo源码下载)
Dec 31 Javascript
javascript 用函数实现继承详解
May 28 Javascript
深究AngularJS如何获取input的焦点(自定义指令)
Jun 12 Javascript
H5实现仿flash效果的实现代码
Sep 29 Javascript
浅析Javascript中双等号(==)隐性转换机制
Oct 27 Javascript
vue项目首屏加载时间优化实战
Apr 23 Javascript
Vue中keep-alive的两种应用方式
Jul 15 Javascript
JS如何监听div的resize事件详解
Dec 03 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
Jquery异步提交表单代码分享
Mar 26 #Javascript
You might like
PHPer 需要了解的 5 个 Composer 小技巧
2014/08/18 PHP
yii2中结合gridview如何使用modal弹窗实例代码详解
2016/06/12 PHP
PHP实现微信JS-SDK接口选择相册及拍照并上传的方法
2016/12/05 PHP
PHP基于redis计数器类定义与用法示例
2018/02/08 PHP
PHP高并发和大流量解决方案整理
2021/03/09 PHP
javascript showModalDialog 内跳转页面的问题
2010/11/25 Javascript
js判断运行jsp页面的浏览器类型以及版本示例
2013/10/30 Javascript
JS、CSS加载中的小问题探讨
2013/11/26 Javascript
jQuery-ui引入后Vs2008的无智能提示问题解决方法
2014/02/10 Javascript
js实现按一下删除键删除整个单词附demo
2014/09/05 Javascript
JQuery中使用on方法绑定hover事件实例
2014/12/09 Javascript
Jquery中使用show()与hide()方法动画显示和隐藏图片
2015/10/08 Javascript
JavaScript 基础函数_深入剖析变量和作用域
2016/05/18 Javascript
使用jquery判断一个元素是否含有一个指定的类(class)实例
2017/02/12 Javascript
NodeJs下的测试框架Mocha的简单介绍
2017/02/22 NodeJs
JS实现浏览器打印、打印预览示例
2017/02/28 Javascript
详解Vue 实例中的生命周期钩子
2017/03/21 Javascript
JS 组件系列之Bootstrap Table 冻结列功能IE浏览器兼容性问题解决方案
2017/06/30 Javascript
js实现canvas保存图片为png格式并下载到本地的方法
2017/08/31 Javascript
使用watch监听路由变化和watch监听对象的实例
2018/02/24 Javascript
layui use 定义js外部引用函数的方法
2019/09/26 Javascript
详解Python设计模式编程中观察者模式与策略模式的运用
2016/03/02 Python
Python编程把二叉树打印成多行代码
2018/01/04 Python
python爬取内容存入Excel实例
2019/02/20 Python
Python基础之函数基本用法与进阶详解
2020/01/02 Python
python encrypt 实现AES加密的实例详解
2020/02/20 Python
解决pycharm不能自动补全第三方库的函数和属性问题
2020/03/12 Python
使用OpenCV去除面积较小的连通域
2020/07/05 Python
AmazeUI的JS表单验证框架实战示例分享
2020/08/21 HTML / CSS
Brora官网:英国领先的羊绒服装品牌
2019/08/28 全球购物
函授本科毕业生自我鉴定
2013/10/16 职场文书
马丁路德金演讲稿
2014/05/19 职场文书
环保标语大全
2014/06/12 职场文书
主要领导对照检查材料
2014/08/26 职场文书
《改造我们的学习》心得体会
2014/11/07 职场文书
2019年图书室自查报告范本
2019/10/12 职场文书