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


Posted in Javascript onMarch 26, 2015

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

下面的代码可实现在文本前和列表前添加新的元素

<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
 $("#btn1").click(function(){
  $("p").prepend("<b>Prepended text</b>. ");
 });
 $("#btn2").click(function(){
  $("ol").prepend("<li>Prepended item</li>");
 });
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
<button id="btn1">Prepend text</button>
<button id="btn2">Prepend list item</button>
</body>
</html>

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

Javascript 相关文章推荐
web的各种前端打印方法之jquery打印插件PrintArea实现网页打印
Jan 09 Javascript
jquery 实现密码框的显示与隐藏示例代码
Sep 18 Javascript
JavaScript函数柯里化详解
Apr 29 Javascript
微信小程序开发之圆形菜单 仿建行圆形菜单实例
Dec 12 Javascript
javascript中对象的定义、使用以及对象和原型链操作小结
Dec 14 Javascript
Vue中添加过渡效果的方法
Mar 16 Javascript
浅谈在Vue.js中如何实现时间转换指令
Jan 06 Javascript
vue+eslint+vscode配置教程
Aug 09 Javascript
javascript操作元素的常见方法小结
Nov 13 Javascript
微信小程序 wx:for 与 wx:for-items 与 wx:key的正确用法
May 19 Javascript
JS sort方法基于数组对象属性值排序
Jul 10 Javascript
JavaScript实现淘宝商品图切换效果
Apr 29 Javascript
jQuery使用append在html元素后同时添加多项内容的方法
Mar 26 #Javascript
jQuery使用before()和after()在元素前后添加内容的方法
Mar 26 #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
You might like
PHP新手上路(十四)
2006/10/09 PHP
php将gd生成的图片缓存到memcache的小例子
2013/06/05 PHP
完美解决PHP中的Cannot modify header information 问题
2013/08/12 PHP
PHP中SESSION的注销与清除
2015/04/16 PHP
如何在旧的PHP系统中使用PHP 5.3之后的库
2015/12/02 PHP
功能强大的php文件上传类
2016/08/29 PHP
PHP基于单例模式编写PDO类的方法
2016/09/13 PHP
PHP实现的迪科斯彻(Dijkstra)最短路径算法实例
2017/09/16 PHP
PHP关于foreach复制知识点总结
2019/01/28 PHP
javascript客户端解决方案 缓存提供程序
2010/07/14 Javascript
JavaScript实现网页上的浮动广告的简单方法
2013/06/14 Javascript
jQuery选择id属性带有点符号元素的方法
2015/03/17 Javascript
iview中Select 选择器多选校验方法
2018/03/15 Javascript
layer更改皮肤的实现方法
2019/09/11 Javascript
Python中运算符&quot;==&quot;和&quot;is&quot;的详解
2016/10/08 Python
python opencv之分水岭算法示例
2018/02/24 Python
python版飞机大战代码分享
2018/11/20 Python
PyCharm+Qt Designer+PyUIC安装配置教程详解
2019/06/13 Python
Python的Tkinter点击按钮触发事件的例子
2019/07/19 Python
解决Django中调用keras的模型出现的问题
2019/08/07 Python
Django CBV与FBV原理及实例详解
2019/08/12 Python
Python3如何在Windows和Linux上打包
2020/02/25 Python
python检查目录文件权限并修改目录文件权限的操作
2020/03/11 Python
利用python 下载bilibili视频
2020/11/13 Python
澳大利亚领先的皮肤诊所:Skin Matrix(抗衰老、痤疮专家、药妆护肤)
2018/05/20 全球购物
Quiksilver美国官网:始于1969年的优质冲浪服和滑雪板外套
2020/04/20 全球购物
《长城》教学反思
2014/02/14 职场文书
高中英语演讲稿范文
2014/04/24 职场文书
企业法人代表任命书
2014/06/06 职场文书
最美孝心少年事迹材料
2014/08/15 职场文书
医院2014国庆节活动策划方案
2014/09/21 职场文书
学习三严三实心得体会
2014/10/13 职场文书
党的群众路线教育实践活动个人整改方案
2014/10/25 职场文书
小学教育见习报告
2014/10/31 职场文书
《地震中的父与子》教学反思
2016/02/16 职场文书
Nginx下配置Https证书详细过程
2021/04/01 Servers