浅谈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 相关文章推荐
jQuery库与其他JS库冲突的解决办法
Feb 07 Javascript
Javascript对象中关于setTimeout和setInterval的this介绍
Jul 21 Javascript
用jQuery实现一些导航条切换,显示隐藏的实例代码
Jun 08 Javascript
js替代copy(示例代码)
Nov 27 Javascript
ZeroClipboard插件实现多浏览器复制功能(支持firefox、chrome、ie6)
Aug 30 Javascript
js中hash和ico的关联分析
Feb 05 Javascript
AngularJS中的Directive实现延迟加载
Jan 25 Javascript
JavaScript数组合并的多种方法
May 22 Javascript
利用jquery禁止外层滚动条的滚动
Jan 05 Javascript
xmlplus组件设计系列之路由(ViewStack)(7)
May 02 Javascript
JavaScript多种页面刷新方法小结
Apr 04 Javascript
JS简易计算器实例讲解
Jun 30 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并发对MYSQL造成压力的解决方法
2013/02/21 PHP
destoon首页调用求购供应信息的地区名称的方法
2014/08/21 PHP
几个实用的PHP内置函数使用指南
2014/11/27 PHP
PHP制作百度词典查词采集器
2015/01/29 PHP
php截取视频指定帧为图片
2016/05/16 PHP
Mac系统下安装PHP Xdebug
2018/03/30 PHP
php使用curl_init()和curl_multi_init()多线程的速度比较详解
2018/08/15 PHP
javascript 得到变量类型的函数
2010/05/19 Javascript
javascript使用中为什么10..toString()正常而10.toString()出错呢
2013/01/11 Javascript
js加载读取内容及显示与隐藏div示例
2014/02/13 Javascript
SeaJS入门教程系列之使用SeaJS(二)
2014/03/03 Javascript
jQuery+ajax实现鼠标单击修改内容的方法
2014/06/27 Javascript
JS实现设置ff与ie元素绝对位置的方法
2016/03/08 Javascript
喜大普奔!jQuery发布 3.0 最终版
2016/06/12 Javascript
浅谈jquery拼接字符串效率比较高的方法
2017/02/22 Javascript
基于jQuery实现瀑布流页面
2017/04/11 jQuery
详解jquery选择器的原理
2017/08/01 jQuery
echarts多条折线图动态分层的实现方法
2019/05/24 Javascript
JavaScript数组排序小程序实现解析
2020/01/13 Javascript
原生JavaScript实现弹幕组件的示例代码
2020/10/12 Javascript
[01:04:05]Mineski vs TNC 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
[00:57]英雄,你的补给到了!
2020/11/13 DOTA
Python中使用第三方库xlrd来读取Excel示例
2015/04/05 Python
利用Python的Django框架中的ORM建立查询API
2015/04/20 Python
基于循环神经网络(RNN)实现影评情感分类
2018/03/26 Python
Python实现求解括号匹配问题的方法
2018/04/17 Python
使用python读取csv文件快速插入数据库的实例
2018/06/21 Python
python分别打包出32位和64位应用程序
2020/02/18 Python
用python实现一个简单计算器(完整DEMO)
2020/10/14 Python
Jones New York官网:美国女装品牌,受白领女性欢迎
2019/11/26 全球购物
法制教育演讲稿
2014/09/10 职场文书
建议书格式
2015/02/04 职场文书
阿凡达观后感
2015/06/10 职场文书
2019商业计划书格式、范文
2019/04/24 职场文书
服务器间如何实现文件共享
2022/05/20 Servers
vue使用element-ui按需引入
2022/05/20 Vue.js