浅谈jQuery before和insertBefore的区别


Posted in Javascript onDecember 04, 2016

jQuery 中利用before和insertBefore可以达到在指定元素前插入指定内容,写法上有区别

先看一个例子:

在<div class='div1'>div1</div>前面插入<div>toInsertContent</div>

实现:

$('<div>toInsertContent</div>').insertBefore($('.div1'));

或者

$('.div1').before('<div>toInsertContent</div>');

结果:

<div>toInsertContent</div>
<div class='div1'>div1</div>

错误写法:

$('<div>toInsertContent</div>').before($('.div1'));

结果:

不但不会在div1前面插入元素,反而会把div1删除

总结:

before前面是在哪个元素前面插入,后面是插入的内容元素

insertBefore前面是插入的内容元素 ,后面是在哪个元素前面插入

不能写反了。

以上这篇浅谈jQuery before和insertBefore的区别就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用js自动判断浏览器分辨率的代码
Jan 28 Javascript
基于jquery DOM写的类似微博发布的效果
Oct 20 Javascript
JavaScript学习笔记之基础语法
Jan 22 Javascript
全面解析Javascript无限添加QQ好友原理
Jun 15 Javascript
浅谈jquery设置和获得checkbox选中的问题
Aug 19 Javascript
jQuery模拟Marquee实现无缝滚动效果完整实例
Sep 29 Javascript
js获取时间函数及扩展函数的方法
Oct 30 Javascript
微信小程序 解析网页内容详解及实例
Feb 22 Javascript
jQuery结合jQuery.cookie.js插件实现换肤功能示例
Oct 14 jQuery
PM2自动部署代码步骤流程总结
Dec 10 Javascript
vue的三种图片引入方式代码实例
Nov 19 Javascript
Vue+scss白天和夜间模式切换功能的实现方法
Jan 05 Vue.js
jQuery根据ID、CLASS、等获取对象的实例
Dec 04 #Javascript
jQuery得到多个值只能用取Class ,不能用取ID的方法
Dec 04 #Javascript
javaScript中定义类或对象的五种方式总结
Dec 04 #Javascript
Javascript中关于Array.filter()的妙用详解
Dec 04 #Javascript
JavaScript 中对象的深拷贝
Dec 04 #Javascript
详解JavaScript模块化开发
Dec 04 #Javascript
javascript 定时器工作原理分析
Dec 03 #Javascript
You might like
一个ubbcode的函数,速度很快.
2006/10/09 PHP
php mssql 数据库分页SQL语句
2008/12/16 PHP
phpMyAdmin 链接表的附加功能尚未激活的问题
2010/08/01 PHP
Yii2增加验证码步骤详解
2016/04/25 PHP
[原创]解决wincache不支持64位PHP5.5/5.6的问题(提供64位wincache下载)
2016/06/22 PHP
Laravel框架使用Seeder实现自动填充数据功能
2018/06/13 PHP
PHP PDO和消息队列的个人理解与应用实例分析
2019/11/25 PHP
PHP程序员简单的开展服务治理架构操作详解(三)
2020/05/14 PHP
Javascript 兼容firefox的一些问题
2009/05/21 Javascript
JQuery中基础过滤选择器用法实例分析
2015/05/18 Javascript
微信开发 微信授权详解
2016/10/21 Javascript
利用jquery实现下拉框的禁用与启用
2016/12/07 Javascript
Javascript中构造函数要注意的一些坑
2017/01/23 Javascript
HTML的select控件美化
2017/03/27 Javascript
关于在vue-cli中使用微信自动登录和分享的实例
2017/06/22 Javascript
vue组件 $children,$refs,$parent的使用详解
2017/07/31 Javascript
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
2019/11/07 jQuery
在vue中实现给每个页面顶部设置title
2020/07/29 Javascript
在vue项目中引用Antv G2,以饼图为例讲解
2020/10/28 Javascript
[03:55]DOTA2完美大师赛选手传记——LFY.MONET
2017/11/18 DOTA
跟老齐学Python之Import 模块
2014/10/13 Python
利用python库在局域网内传输文件的方法
2018/06/04 Python
Python 使用threading+Queue实现线程池示例
2019/12/21 Python
Python callable内置函数原理解析
2020/03/05 Python
CHARLES & KEITH英国官网:新加坡时尚品牌
2018/07/04 全球购物
俄罗斯建筑和装饰材料在线商店:Stroilandia
2020/07/25 全球购物
业务代表的岗位职责
2013/11/16 职场文书
宾馆总经理岗位职责
2014/02/14 职场文书
活动总结怎么写
2014/04/28 职场文书
党员一帮一活动总结
2014/07/08 职场文书
民间借贷协议书范本
2014/10/01 职场文书
2015年机关纠风工作总结
2015/05/15 职场文书
python实现大文本文件分割成多个小文件
2021/04/20 Python
Redis可视化客户端小结
2021/06/10 Redis
Python Flask搭建yolov3目标检测系统详解流程
2021/11/07 Python
golang生成并解析JSON
2022/04/14 Golang