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 相关文章推荐
js 判断浏览器类型 去全角、半角空格 自动关闭当前窗口
Apr 10 Javascript
网页中的图片的处理方法与代码
Nov 26 Javascript
js 处理数组重复元素示例代码
Dec 27 Javascript
无刷新预览所选择的图片示例代码
Apr 02 Javascript
JavaScript中反正弦函数Math.asin()的使用简介
Jun 14 Javascript
js实现类bootstrap模态框动画
Feb 07 Javascript
discuz表情的JS提取方法分析
Mar 22 Javascript
微信小程序删除处理详解
Aug 16 Javascript
JS随机密码生成算法
Sep 23 Javascript
详解小程序如何动态绑定点击的执行方法
Nov 26 Javascript
JavaScript实现网页动态生成表格
Nov 25 Javascript
jQuery class属性操作addClass()与removeClass()、hasClass()、toggleClass()
Mar 31 jQuery
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
第十一节 重载 [11]
2006/10/09 PHP
php Ajax乱码
2008/04/09 PHP
基于PHP文件操作的详解
2013/06/05 PHP
php常用表单验证类用法实例
2015/06/18 PHP
php动态读取数据清除最右边距的方法
2017/04/12 PHP
php 如何设置一个严格控制过期时间的session
2017/05/05 PHP
Django 中 cookie的使用
2017/08/17 PHP
php ajax confirm 删除实例详解
2019/03/06 PHP
js null undefined 空区别说明
2010/06/13 Javascript
jquery 设置元素相对于另一个元素的top值(实例代码)
2013/11/06 Javascript
实例讲解JQuery中this和$(this)区别
2014/12/08 Javascript
JavaScript实现下拉列表框数据增加、删除、上下排序的方法
2015/08/11 Javascript
关于JavaScript作用域你想知道的一切
2016/02/04 Javascript
基于javascript制作微信聊天面板
2020/08/09 Javascript
SeaJS中use函数用法实例分析
2017/10/10 Javascript
vue2实现搜索结果中的搜索关键字高亮的代码
2018/08/29 Javascript
vue中Element-ui 输入银行账号每四位加一个空格的实现代码
2018/09/14 Javascript
理理Vue细节(推荐)
2019/04/16 Javascript
深入浅出了解Node.js Streams
2019/05/27 Javascript
JS中如何轻松遍历对象属性的方式总结
2019/08/06 Javascript
swiper自定义分页器的样式
2020/09/14 Javascript
Python实现生成随机数据插入mysql数据库的方法
2017/12/25 Python
python如何重载模块实例解析
2018/01/25 Python
Python简单实现阿拉伯数字和罗马数字的互相转换功能示例
2018/04/17 Python
python使用for循环计算0-100的整数的和方法
2019/02/01 Python
Python常用爬虫代码总结方便查询
2019/02/25 Python
用Python徒手撸一个股票回测框架搭建【推荐】
2019/08/05 Python
python3注册全局热键的实现
2020/03/22 Python
Django数据统计功能count()的使用
2020/11/30 Python
Trench London官方网站:高级风衣和意大利皮夹克
2020/07/11 全球购物
Linux内核的同步机制是什么?主要有哪几种内核锁
2016/07/11 面试题
高三自我鉴定
2013/10/23 职场文书
运动会通讯稿400字
2014/01/28 职场文书
学校食品安全责任书
2015/01/29 职场文书
幼儿园校车安全责任书
2015/05/08 职场文书
Python实现聚类K-means算法详解
2022/07/15 Python