浅谈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 change,propertychange,input事件小议
Dec 20 Javascript
JavaScript自定义日期格式化函数详细解析
Jan 14 Javascript
JS实现同一个网页布局滑动门和TAB选项卡实例
Sep 23 Javascript
使用jQuery mobile库检测url绝对地址和相对地址的方法
Dec 04 Javascript
JS检测移动端横竖屏的代码
May 30 Javascript
BootStrap 实现各种样式的进度条效果
Dec 07 Javascript
jQuery UI Draggable + Sortable 结合使用(实例讲解)
Sep 07 jQuery
Node.js中环境变量process.env的一些事详解
Oct 26 Javascript
解决使用vue.js路由后失效的问题
Mar 17 Javascript
Vue+element+cookie记住密码功能的简单实现方法
Sep 20 Javascript
Openlayers绘制地图标注
Sep 28 Javascript
详解基于element的区间选择组件校验(交易金额)
Jan 07 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的面试题集,附我的答案和分析(一)
2006/11/19 PHP
PHP常用的缓存技术汇总
2014/05/05 PHP
PHP自动生成缩略图函数的源码示例
2019/03/18 PHP
PHP钩子实现方法解析
2019/05/21 PHP
Vagrant(WSL)+PHPStorm+Xdebu 断点调试环境搭建
2019/12/13 PHP
用js实现控制内容的向上向下滚动效果
2007/06/26 Javascript
Eval and new funciton not the same thing
2012/12/27 Javascript
javascript分页代码实例分享(js分页)
2013/12/13 Javascript
JS实现的通用表单验证插件完整实例
2015/08/20 Javascript
Node.js npm命令运行node.js脚本的方法
2018/10/10 Javascript
[02:35]DOTA2英雄基础教程 狙击手
2014/01/14 DOTA
Python中input和raw_input的一点区别
2014/10/21 Python
Python聚类算法之DBSACN实例分析
2015/11/20 Python
Python实现读取SQLServer数据并插入到MongoDB数据库的方法示例
2018/06/09 Python
python实现周期方波信号频谱图
2018/07/21 Python
Python多进程池 multiprocessing Pool用法示例
2018/09/07 Python
详解关于Django中ORM数据库迁移的配置
2018/10/08 Python
Python文件监听工具pyinotify与watchdog实例
2018/10/15 Python
pip安装提示Twisted错误问题(Python3.6.4安装Twisted错误)
2020/05/09 Python
python实现简单的学生管理系统
2021/02/22 Python
Application Cache未缓存文件无法访问无法加载问题
2014/05/31 HTML / CSS
电子狗项圈:eDog Australia
2019/12/04 全球购物
戴尔马来西亚官网:Dell Malaysia
2020/05/02 全球购物
大学毕业生个人自荐信范文
2014/01/08 职场文书
检查接待方案
2014/02/27 职场文书
医学生毕业自我鉴定
2014/03/26 职场文书
经济管理自荐书
2014/06/09 职场文书
法院四风对照检查材料思想汇报
2014/10/06 职场文书
部队个人年终总结
2015/03/02 职场文书
乡镇法制宣传日活动总结
2015/05/05 职场文书
小学少先队活动总结
2015/05/08 职场文书
班主任远程培训研修日志
2015/11/13 职场文书
python基于tkinter制作m3u8视频下载工具
2021/04/24 Python
Python 快速验证代理IP是否有效的方法实现
2021/07/15 Python
springboot + mongodb 通过经纬度坐标匹配平面区域的方法
2021/11/01 MongoDB
Android Studio实现带三角函数对数运算功能的高级计算器
2022/05/20 Java/Android