浅谈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 相关文章推荐
javascript基础知识大集锦(二) 推荐收藏
Jan 13 Javascript
关于javascript模块加载技术的一些思考
Nov 28 Javascript
require简单实现单页应用程序(SPA)
Jul 12 Javascript
浅谈js中对象的使用
Aug 11 Javascript
关于JavaScript和jQuery的类型判断详解
Oct 08 Javascript
JS控件bootstrap suggest plugin使用方法详解
Mar 25 Javascript
JS仿淘宝搜索框用户输入事件的实现
Jun 19 Javascript
BootStrap Validator 根据条件在JS中添加或移除校验操作
Oct 12 Javascript
javascript实现最长公共子序列实例代码
Feb 05 Javascript
浅谈vue中关于checkbox数据绑定v-model指令的个人理解
Nov 14 Javascript
JavaScript实现飞舞的泡泡效果
Feb 07 Javascript
node.js如何根据URL返回指定的图片详解
Oct 21 Javascript
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
PHP实现简单搜歌的方法
2015/07/28 PHP
js 鼠标点击事件及其它捕获
2009/06/04 Javascript
同一页面多个商品倒计时JS 基于面向对象的javascript
2012/02/16 Javascript
基于jQuery的简单九宫格实现代码
2012/08/09 Javascript
jquery插件开发注意事项小结
2013/06/04 Javascript
jQuery插件Slider Revolution实现响应动画滑动图片切换效果
2015/06/05 Javascript
jQuery leonaScroll 1.1 自定义滚动条插件(推荐)
2016/09/17 Javascript
JS实现禁止高频率连续点击的方法【基于ES6语法】
2017/04/25 Javascript
详解JSONObject和JSONArray区别及基本用法
2017/10/25 Javascript
详解Vue中localstorage和sessionstorage的使用
2017/12/22 Javascript
vue2.0 使用element-ui里的upload组件实现图片预览效果方法
2018/09/04 Javascript
深入理解Vue 的钩子函数
2018/09/05 Javascript
js实现导航跟随效果
2018/11/17 Javascript
简单通过settimeout看javascript的运行机制
2019/05/10 Javascript
原生JS实现音乐播放器
2021/01/26 Javascript
[01:35]辉夜杯战队访谈宣传片—LGD
2015/12/25 DOTA
python脚本设置超时机制系统时间的方法
2016/02/21 Python
Tornado协程在python2.7如何返回值(实现方法)
2017/06/22 Python
python中dict字典的查询键值对 遍历 排序 创建 访问 更新 删除基础操作方法
2018/09/13 Python
深入浅析Python2.x和3.x版本的主要区别
2018/11/30 Python
python redis连接 有序集合去重的代码
2019/08/04 Python
python用tkinter实现一个简易能进行随机点名的界面
2020/09/27 Python
英国版MAC彩妆品牌:Illamasqua
2018/04/18 全球购物
美国在线眼镜店:GlassesShop
2018/11/15 全球购物
简历中求职的个人自我评价
2013/12/03 职场文书
技校个人求职信范文
2014/01/25 职场文书
会计学自我鉴定
2014/02/06 职场文书
应届毕业生应聘自荐信范文
2014/02/26 职场文书
新春文艺演出主持词
2014/03/27 职场文书
贸易跟单员英文求职信
2014/04/19 职场文书
小学运动会报道稿
2014/10/04 职场文书
齐云山导游词
2015/02/06 职场文书
商务英语求职信范文
2015/03/19 职场文书
2016反腐倡廉警示教育心得体会
2016/01/13 职场文书
Vue的过滤器你真了解吗
2022/02/24 Vue.js
python神经网络Xception模型
2022/05/06 Python