jQuery中的insertBefore(),insertAfter(),after(),before()区别介绍
insertBefore():a.insertBefore(b)
a在前,b在后,
a:是一个选择器,b:也是一个选择器
<!DOCTYPE html> <html> <head> <meta charset='UTF-8'> <title>jqu</title> <script type="text/javascript" src='jquery-2.2.0.min.js'></script> </head> <body> <p class='p1'>p1:hello</p> hello world <p class='p2'>p2:wenwen</p> hello wo </body> <script type="text/javascript"> $(function(){ $('.p2').insertBefore('.p1'); }) </script> </html>
得到:
p2:wenwen p1:hello hello world hello wo
insertAfter():跟insertBefore()是一样的道理
a.insertAfter(b)
a在后,b在前
现在是说before()
before():a.before()
a是页面上已有的选择器,b是你需要添加的内容,注意:是什么就是什么,会识别标签,b不是一个选择器
a在后,b在前
<!DOCTYPE html> <html> <head> <meta charset='UTF-8'> <title>jqu</title> <script type="text/javascript" src='jquery-2.2.0.min.js'></script> </head> <body> <p class='p1'>p1:hello</p> <p class='p2'>p2:wenwen</p> </body> <script type="text/javascript"> $(function(){ $('.p2').before('.p1'); }) </script> </html>
最后得到:
p1:hello .p1 p2:wenwen
看到吗?.p1并不识别选择器,直接就是字符串,在.p2选择器的前面位置
after():跟before()是同理的,只是一个在前一个在后
我只是想说insertBefore(),insertAfter()跟before(),after()的区别,我感觉最大一个区别就是看你要用到的场景,你要是需要两个选择器的位置调换就用
insertBefore(),insertAfter()
要是需要一个选择器跟一个文本进行调换位置就可以用before(),after();当然这个不只是调换位置啦
调换位置是说页面上已经存在的东西,这个方法里面也可以加页面上没有的东西,比如:
$('<p class='p3'>嘿嘿</p>').insertBefore('.p1');
以上所述是小编给大家介绍的jQuery中的insertBefore(),insertAfter(),after(),before()区别介绍,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
相关推荐
-
MySQL触发器 Update触发Insert失败
今天工作需要,想要实现将仅对状态更新的表进行历史记录显示,于是考虑在原表中建立触发器,将更新的内容同时写入另一张表 于是进行测试 --建立测试表CREATE TABLE `triggletest_triggle` ( `id` INT(11) NOT NULL, `name` VARCHAR(5) NULL DEFAULT NULL, PRIMARY KEY (`id`) ) COLLATE='latin1_swedish_ci' ENGINE=InnoDB --建立目标表 CREATE TAB
-
将表里的数据批量生成INSERT语句的存储过程 增强版
有时候,我们需要将某个表里的数据全部或者根据查询条件导出来,迁移到另一个相同结构的库中 目前SQL Server里面是没有相关的工具根据查询条件来生成INSERT语句的,只有借助第三方工具(third party tools) 这种脚本网上也有很多,但是网上的脚本还是欠缺一些规范和功能,例如:我只想导出特定查询条件的数据,网上的脚本都是导出全表数据 如果表很大,对性能会有很大影响 这里有一个存储过程(适用于SQLServer2005 或以上版本) -- Author: <桦仔> -- Blog
-
C++ primer基础之容器insert
C++ primer基础之容器insert 今天学习C++ 基础知识的时候遇到这样问题,始终出现segments fault.最后才发现原来是自己对"容器insert之后迭代器会失效"的理解不够透彻. 题目如下: 假定iv是一个int的vector,下面的程序存在什么错误?你将如何修改? auto iter = iv.begin(); auto mid = iv.begin() + iv.size() / 2; while(iter != mid){ if(*iter == some_
-
MySQL中insert语句的使用与优化教程
MySQL 表中使用 INSERT INTO SQL语句来插入数据. 你可以通过 mysql> 命令提示窗口中向数据表中插入数据,或者通过PHP脚本来插入数据. 语法 以下为向MySQL数据表插入数据通用的 INSERT INTO SQL语法: INSERT INTO table_name ( field1, field2,...fieldN ) VALUES ( value1, value2,...valueN ); 如果数据是字符型,必须使用单引号或者双引号,如:"value"
-
PHP用mysql_insert_id()函数获得刚插入数据或当前发布文章的ID
前言 最近在工作中又遇到了这个问题,PHP中如何获得刚插入数据的ID(或当前发布文章的ID)呢?觉得有必要整理下详细的解决方法,方便自己也给有需要的朋友们提供以帮助,那么话不多说了,来看看详细的解决介绍. 解决方法 其实用 mysql_insert_id() 函数就可以实现的. 定义和用法 mysql_insert_id() 函数返回上一步 INSERT 操作产生的 ID. 注意:如果上一查询没有产生 AUTO_INCREMENT 的 ID,则 mysql_insert_id() 返回 0. 语
-
MyBatis批量插入(insert)数据操作
在程序中封装了一个List集合对象,然后需要把该集合中的实体插入到数据库中,由于项目使用了Spring+MyBatis的配置,所以打算使用MyBatis批量插入,由于之前没用过批量插入,在网上找了一些资料后最终实现了,把详细过程贴出来. 实体类TrainRecord结构如下: public class TrainRecord implements Serializable { private static final long serialVersionUID = -12069604621179
-
MyBatis中insert操作返回主键的实现方法
在使用MyBatis做持久层时,insert语句默认是不返回记录的主键值,而是返回插入的记录条数:如果业务层需要得到记录的主键时,可以通过配置的方式来完成这个功能 针对Sequence主键而言,在执行insert sql前必须指定一个主键值给要插入的记录,如Oracle.DB2,可以采用如下配置方式: <insert id="add" parameterType="vo.Category"> <selectKey resultType="
-
详解MySQL数据库insert和update语句
用于操作数据库的SQL一般分为两种,一种是查询语句,也就是我们所说的SELECT语句,另外一种就是更新语句,也叫做数据操作语句.SQL语句中的更新语句update是最常用的语句之一,言外之意,就是对数据进行修改.在标准的SQL中有3个语句,它们是INSERT.UPDATE以及DELETE. 用于操作数据库的SQL一般分为两种,一种是查询语句,也就是我们所说的SELECT语句,另外一种就是更新语句,也叫做数据操作语句.言外之意,就 是对数据进行修改.在标准的SQL中有3个语句,它们是INSERT.
-
Oracle+Mybatis的foreach insert批量插入报错的快速解决办法
最近做一个批量导入的需求,将多条记录批量插入数据库中. 解决思路:在程序中封装一个List集合对象,然后把该集合中的实体插入到数据库中,因为项目使用了MyBatis,所以打算使用MyBatis的foreach功能进行批量插入.期间遇到了"SQL 命令未正确结束 "的错误,最终解决,记录下来供以后查阅和学习. 首先,在网上参考了有关Mybatis的foreach insert的资料,具体如下: foreach的主要用在构建in条件中,它可以在SQL语句中进行迭代一个集合. foreach
-
jQuery中的insertBefore(),insertAfter(),after(),before()区别介绍
insertBefore():a.insertBefore(b) a在前,b在后, a:是一个选择器,b:也是一个选择器 <!DOCTYPE html> <html> <head> <meta charset='UTF-8'> <title>jqu</title> <script type="text/javascript" src='jquery-2.2.0.min.js'></script&g
-
jQuery中text() val()和html()的区别实例详解
简单的说:html()和text()的区别主要在于是否包含标签.而val()针对的是表单元素. 但是有时还是不是那么太清晰. html(),val(),text()都分为有参和无参. 举例说明它们的不同之处: html()在没有参数的情况下,取得第一个匹配元素的内容.必须要注意的是,即使匹配多个,也只能取得匹配的第一个元素. 如: <body> <p>你选中这段文字后,看看它们的文本颜色和背景色,就能明白::selection的作用.</p> <h3>选中下
-
jquery中live()方法和bind()方法区别分析
本文实例讲述了jquery中live()方法和bind()方法区别.分享给大家供大家参考,具体如下: live()不受加载时间顺序的影响,只要查找能够配对上就能够绑定对应的事件,而bind方法只有在第一次被加载的时候才绑定时间,如果代码之后再加载配对的元素,则不能绑定对应的事件 $("#manual_disconnect").live("click", function(){ connectionProfile("0"); }); $("
-
jquery中attr、prop、data区别与用法分析
本文实例讲述了jquery中attr.prop.data区别与用法.分享给大家供大家参考,具体如下: 在高版本的jquery中获取标签的属性,可以使用attr().prop().data(),那么这些方法有什么区别呢? 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法. 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法. .data()看作是存取data-xxx这样DOM附加信息的方法 上面的描述也许有点模糊,举几个例子就知道了. <a href="h
-
jQuery中event.target和this的区别详解
this和event.target的区别: 1.js中事件是会冒泡的,所以this是可以变化的,但event.target不会变化,它永远指向触发事件的DOM元素本身: 2.this和event.target都是dom对象,使用jQuey中的方法可以将他们转换为jquery对象:$(this)和$(event.target). 比如,一个很简单的例子. $(event.target)指向触发事件的元素. 当点击蓝色小方框时, 蓝色小方框会变成橙色, 但其外围的大方框不会变色, 即没有触发事件的冒
-
oracle中存储函数与存储过程的区别介绍
在oracle中,函数和存储过程是经常使用到的,他们的语法中有很多相似的地方,可是也有它们的不同之处,这段时间刚学完函数与存储过程,来给自己做一个总结: 一:存储过程:简单来说就是有名字的pl/sql块. 语法结构: create or replace 存储过程名(参数列表) is --定义变量 begin --pl/sql end; 案例: create or replace procedure add_(a int,b int) is c int; begin c:=a+b; dbms_ou
-
MyBatis中关于resultType和resultMap的区别介绍
MyBatis中在查询进行select映射的时候,返回类型可以用resultType,也可以用resultMap,resultType是直接表示返回类型的(对应着我们的model对象中的实体),而resultMap则是对外部ResultMap的引用(提前定义了db和model之间的隐射key-->value关系),但是resultType跟resultMap不能同时存在. 在MyBatis进行查询映射时,其实查询出来的每一个属性都是放在一个对应的Map里面的,其中键是属性名,值则是其对应的值.
-
深入理解Python中的 __new__ 和 __init__及区别介绍
本文的目的是讨论Python中 __new__ 和 __ini___ 的用法. __new__ 和 __init__ 的区别主要表现在:1. 它自身的区别:2. 及在Python中新式类和老式类的定义. 理解 __new__ 和 __init__ 的区别 这两个方法的主要区别在于:__new__ 负责对象的创建而 __init__ 负责对象的初始化.在对象的实例化过程中,这两个方法会有些细微的差别,表现于:如何工作,何时定义. Python中两种类的定义方式 Python 2.x 中类的定义分为
-
Java中关键字final finally finalize的区别介绍
目录 1. final 1.1 final修饰属性 1.2 final修饰方法 1.3 final修饰类 2. finally 3. finalize 这三个除了长得像以外,好像没什么联系 1. final final意为“最后的”,它是Java中的一个关键字. final可以修饰属性.方法.类. 1.1 final修饰属性 从final的含义就不难理解用final修饰内容的用意.final修饰属性,就表示这个属性是“最终的”,也就是不可更改的,换成我们熟悉的名词,也就是“常量”. privat
-
jQuery中对节点进行操作的相关介绍
动态创建Dom节点 jQuery中使用$(html字符串)来动态创建Dom节点,并且返回一个jQuery对象,可以调用append等方法将创建的节点添加到Dom中. 例如: var link = $("<a href='http://www.baidu.com'>百度</a>"); $("div:first").append(link); 添加节点元素的方法: Append方法用来在元素的末尾追加元素(最后一个子节点) Prepend在元素的
随机推荐
- vue 1.x 交互实现仿百度下拉列表示例
- python+pyqt实现12306图片验证效果
- php中替换字符串函数strtr()和str_repalce()的用法与区别
- VBS教程:VBscript语句-Option Explicit 语句
- GO语言实现简单TCP服务的方法
- 新老版本juqery获取radio对象的方法
- C# 6.0 新特性汇总
- java 获取项目文件路径实现方法
- 利用.net代码实现发送邮件
- 基于PHP实现通过照片获取ip地址
- 深入理解javascript的执行顺序
- JavaScript 键盘event.keyCode值列表大全
- 如何利用jQuery post传递含特殊字符的数据
- asp 批量删除选中的多条记录的实现代码
- jsp中如何实现按下回车键自动提交表单
- 添加一个以前写的table的spliter给大家
- 页面加载完成后再执行JS的jquery写法以及区别说明
- jQuery 源码分析笔记(6) jQuery.data
- 对联广告 flash版
- 深入理解Java中的弱引用