jQuery使用prepend()方法在元素前添加内容用法实例
本文实例讲述了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程序设计有所帮助。
相关推荐
-
jQuery中prependTo()方法用法实例
本文实例讲述了jQuery中prependTo()方法用法.分享给大家供大家参考.具体分析如下: 此方法把匹配的元素插入指定元素之前. prependTo()方法的作用和prepend()方法是相同的,但是在语法上是有差别的,虽然在形式上看起来是一样的. 语法结构: 复制代码 代码如下: $(selector).prependTo(content) 参数列表: 参数 描述 selector 要被插入的匹配元素. content 要被插入匹配元素的元素. 实例代码: 复制代码 代码如下: <!DO
-
jQuery 追加元素的方法如append、prepend、before
1.jQuery append() 方法 jQuery append() 方法在被选元素的结尾插入内容. 实例 $("p").append("Some appended text."); 2.jQuery prepend() 方法 jQuery prepend() 方法在被选元素的开头插入内容. 实例 $("p").prepend("Some prepended text."); 3.after() 和 before() 方法
-
jQuery中prepend()方法使用详解
prepend()方法将指定元素插入匹配元素按内部的开头,其作用和prependTo()方法基本相同,只在语法上有差别,虽然说在语法形式上看基本相同. 下面介绍下语法结构: 复制代码 代码如下: $(selector).prepend(content) 参数列表: demo: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author&qu
-
jQuery中prepend()方法用法实例
本文实例讲述了jQuery中prepend()方法用法.分享给大家供大家参考.具体分析如下: 此方法可向所有匹配元素的内部的前面追加HTML内容. 特别说明: 此方法是追加内容,也就是原来的内容还在. HTML内容就是内容中可以包含HTML标签,并且能够被浏览器渲染. 文本内容是先将内容中的html预定义字符转换成html字符实体,这样html标签就不会被渲染. 语法结构: 复制代码 代码如下: $(selector).prepend(content) 实例代码: 实例一: 复制代码 代码如下:
-
jQuery使用prepend()方法在元素前添加内容用法实例
本文实例讲述了jQuery使用prepend()方法在元素前添加内容的用法.分享给大家供大家参考.具体分析如下: 下面的代码可实现在文本前和列表前添加新的元素 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#btn1"
-
jQuery使用after()方法在元素后面添加多项内容的方法
本文实例讲述了jQuery使用after()方法在元素后面添加多项内容的方法.分享给大家供大家参考.具体分析如下: jQuery可通过after()方法在元素后面添加多项内容,after()可以带多个参数,在指定元素后面添加多项内容 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> function af
-
jQuery使用before()和after()在元素前后添加内容的方法
本文实例讲述了jQuery使用before()和after()在元素前后添加内容的方法.分享给大家供大家参考.具体如下: <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#btn1").click(function()
-
jQuery使用addClass()方法给元素添加多个class样式
本文实例讲述了jQuery使用addClass()方法给元素添加多个class样式的方法.分享给大家供大家参考.具体如下: jQuery通过addClass()方法给元素添加多个class,只需要在添加的class中用空格分开多个class既可 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(doc
-
jQuery使用empty()方法删除元素及其所有子元素的方法
本文实例讲述了jQuery使用empty()方法删除元素及其所有子元素的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function()
-
jQuery使用hide方法隐藏元素自身用法实例
本文实例讲述了jQuery使用hide方法隐藏元素自身用法,分享给大家供大家参考.具体如下: 下面的JS代码实现让按钮点击后将自己隐藏起来 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(
-
jQuery使用removeClass方法删除元素指定Class的方法
本文实例讲述了jQuery使用removeClass方法删除元素指定Class的方法.分享给大家供大家参考.具体分析如下: <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function
-
Jquery的基本对象转换和文档加载用法实例
本文实例讲述了Jquery的基本对象转换和文档加载用法.分享给大家供大家参考.具体如下: 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <
-
JavaScript使用push方法添加一个元素到数组末尾用法实例
本文实例讲述了JavaScript使用push方法添加一个元素到数组末尾的用法.分享给大家供大家参考.具体如下: 下面的代码演示了JS数组通过push方法添加一个元素到数组末尾 <!DOCTYPE html> <html> <body> <p id="demo"> Click the button to add a new element to the array. </p> <button onclick="
随机推荐
- fckeditor编辑器下的自定义分页符实现方法
- 原生JavaScript实现精美的淘宝轮播图效果示例【附demo源码下载】
- java实现单人版五子棋游戏
- VS2010发布Web网站技术攻略
- "PageMethods未定义"或"对象不支持此属性或方法"解决方法分享
- CodeIgniter启用缓存和清除缓存的方法
- centOS7安装MySQL数据库
- JS实现简单易用的手机端浮动窗口显示效果
- C++判断pe文件实例
- jquery中 $.expr使用实例介绍
- php 网页播放器用来播放在线视频的代码(自动判断并选择视频文件类型)
- phpMyAdmin 链接表的附加功能尚未激活问题的解决方法(已测)
- 基于Python对象引用、可变性和垃圾回收详解
- 有用的SQL语句(删除重复记录,收缩日志)
- mysqli预处理编译的深入理解
- 详解Javascript 装载和执行
- 徐州电信关于您本次上网未使用“星空极速”拨号软件的投诉
- Cache-control使用Cache-control:private学习笔记
- 启用带宽限制功能的用户,请确认已安装QoS
- Bootstrap 网站实例之单页营销网站