javascript insertAfter()定义与用法示例


Posted in Javascript onJuly 25, 2016

本文实例讲述了javascript insertAfter()定义与用法。分享给大家供大家参考,具体如下:

HTML部分:

<div id="b">bbbbbbbbb</div>
<div>dddddd</div>

JavaScript部分:

window.onload=function(){
  var a =document.createElement("span");
  var b =document.createTextNode("cssrain");
  a.appendChild(b);
  var mubiao = document.getElementById("b");
  insertAfter(a,mubiao); 
}
function insertAfter(newElement,targetElement) {
  var parent = targetElement.parentNode;
   if (parent.lastChild == targetElement) {// 如果最后的节点是目标元素,则直接添加。因为默认是最后
    parent.appendChild(newElement);
   } else {
    parent.insertBefore(newElement,targetElement.nextSibling);//如果不是,则插入在目标元素的下一个兄弟节点的前面。也就是目标元素的后面。
   }
}

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
通过ifame指向的页面高度调整iframe的高度
Oct 05 Javascript
在iframe里的页面编写js,实现在父窗口上创建动画效果展开和收缩的div(不变动iframe父窗口代码)
Dec 20 Javascript
JavaScript页面模板库handlebars的简单用法
Mar 02 Javascript
JS设置cookie、读取cookie、删除cookie
Apr 17 Javascript
jQuery插件扩展测试实例
Jun 21 Javascript
javascript监听页面刷新和页面关闭事件方法详解
Jan 09 Javascript
jQuery选择器之属性过滤选择器详解
Sep 28 jQuery
jQuery实现弹窗下底部页面禁止滑动效果
Dec 19 jQuery
JavaScript 日期时间选择器一些小结
Apr 02 Javascript
Bootstrap table表格初始化表格数据的方法
Jul 25 Javascript
[原创]微信小程序获取网络类型的方法示例
Mar 01 Javascript
详解JavaScript执行模型
Nov 16 Javascript
jquery之别踩白块游戏的简单实现
Jul 25 #Javascript
JavaScript禁止用户多次提交的两种方法
Jul 24 #Javascript
JavaScript表单焦点自动切换代码
Jul 24 #Javascript
javascript中sort排序实例详解
Jul 24 #Javascript
深入理解javascript作用域第二篇之词法作用域和动态作用域
Jul 24 #Javascript
关于input全选反选恶心的异常情况
Jul 24 #Javascript
JS中的==运算: [''] == false —&gt;true
Jul 24 #Javascript
You might like
php设计模式 Prototype (原型模式)代码
2011/06/26 PHP
php去除字符串中空字符的常用方法小结
2015/03/17 PHP
PHP封装的Twitter访问类实例
2015/07/18 PHP
xml 与javascript结合的问题解决方法
2007/03/24 Javascript
正则表达式判断是否存在中文和全角字符和判断包含中文字符串长度
2008/09/27 Javascript
javascript 面向对象编程  function是方法(函数)
2009/09/17 Javascript
JS面向对象编程之对象使用分析
2010/08/19 Javascript
JavaScript 选中文字并响应获取的实现代码
2011/08/28 Javascript
js和css写一个可以自动隐藏的悬浮框
2014/03/05 Javascript
深入理解JavaScript的React框架的原理
2015/07/02 Javascript
深入浅析AngularJs模版与v-bind
2018/07/06 Javascript
JavaScript函数节流和函数去抖知识点学习
2018/07/31 Javascript
Vue路由history模式解决404问题的几种方法
2018/09/29 Javascript
JS双向链表实现与使用方法示例(增加一个previous属性实现)
2019/01/31 Javascript
vue百度地图 + 定位的详解
2019/05/13 Javascript
JavaScript模块管理的简单实现方式详解
2019/06/15 Javascript
小程序和web画三角形实现解析
2019/09/02 Javascript
js计时事件实现圆形时钟
2020/03/25 Javascript
使用Python开发windows GUI程序入门实例
2014/10/23 Python
Python将多个excel表格合并为一个表格
2021/02/22 Python
python实现识别手写数字 python图像识别算法
2020/03/23 Python
python使用pycharm环境调用opencv库
2018/02/11 Python
django中的数据库迁移的实现
2020/03/16 Python
python Cartopy的基础使用详解
2020/11/01 Python
Numpy数组的广播机制的实现
2020/11/03 Python
什么是聚集索引和非聚集索引
2012/01/17 面试题
在职人员函授期间自我评价分享
2013/11/08 职场文书
教师自我鉴定
2013/12/13 职场文书
计算机毕业大学生求职信
2014/06/26 职场文书
党的群众路线教育实践活动查摆问题及整改措施
2014/10/10 职场文书
网吧员工管理制度
2015/08/05 职场文书
2015年国庆节寄语
2015/08/17 职场文书
Python机器学习之决策树和随机森林
2021/07/15 Javascript
java设计模式--原型模式详解
2021/07/21 Java/Android
最新最全的手机号验证正则表达式
2022/02/24 Javascript
springboot创建的web项目整合Quartz框架的项目实践
2022/06/21 Java/Android