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 相关文章推荐
基于Jquery的仿照flash放大图片效果代码
Mar 16 Javascript
jquery获得页面元素的坐标值实现思路及代码
Apr 15 Javascript
JavaScript实现查找字符串中第一个不重复的字符
Dec 29 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
Nov 17 Javascript
js判断checkbox是否选中个数的方法(超简单)
Aug 19 Javascript
jQuery Validate插件实现表单验证
Aug 19 Javascript
JavaScript之class继承_动力节点Java学院整理
Jul 03 Javascript
JS实现闭包中的沙箱模式示例
Sep 07 Javascript
.vue文件 加scoped 样式不起作用的解决方法
May 28 Javascript
使用Vue CLI创建typescript项目的方法
Aug 09 Javascript
Vue检测屏幕变化来改变不同的charts样式实例
Oct 26 Javascript
Vue通过阿里云oss的url连接直接下载文件并修改文件名的方法
Dec 25 Vue.js
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
Discuz Uchome ajaxpost小技巧
2011/01/04 PHP
php使用curl发送json格式数据实例
2013/12/17 PHP
php jsonp单引号转义
2014/11/23 PHP
ThinkPHP采用原生query实现关联查询left join实例
2014/12/02 PHP
PHP基于socket实现的简单客户端和服务端通讯功能示例
2017/07/10 PHP
jQuery获取css z-index在各种浏览器中的返回值
2010/09/15 Javascript
用js实现控件的隐藏及style.visibility的使用
2013/06/14 Javascript
js生成随机数之random函数随机示例
2013/12/20 Javascript
jQuery源码分析之jQuery.fn.each与jQuery.each用法
2015/01/23 Javascript
基于Bootstrap实现Material Design风格表单插件 附源码下载
2016/04/18 Javascript
javascript实现电脑和手机版样式切换
2017/11/10 Javascript
详解Vue2 SSR 缓存 Api 数据
2017/11/20 Javascript
浅谈MUI框架中加载外部网页或服务器数据的方法
2018/01/31 Javascript
微信小程序开发背景图显示功能
2018/08/08 Javascript
JS div匀速移动动画与变速移动动画代码实例
2019/03/26 Javascript
使用 Element UI Table 的 slot-scope方法
2019/10/10 Javascript
Vue分页效果与购物车功能
2019/12/13 Javascript
Nodejs + sequelize 实现增删改查操作
2020/11/07 NodeJs
[01:02]DOTA2上海特锦赛SHOWOPEN
2016/03/25 DOTA
Python中类的继承代码实例
2014/10/28 Python
在Django中使用Sitemap的方法讲解
2015/07/22 Python
Python利用openpyxl库遍历Sheet的实例
2018/05/03 Python
对python 读取线的shp文件实例详解
2018/12/22 Python
对python PLT中的image和skimage处理图片方法详解
2019/01/10 Python
python贪吃蛇游戏代码
2020/04/18 Python
python开启debug模式的方法
2019/06/27 Python
Python 如何优雅的将数字转化为时间格式的方法
2019/09/26 Python
flask的orm框架SQLAlchemy查询实现解析
2019/12/12 Python
tensorflow mnist 数据加载实现并画图效果
2020/02/05 Python
Keds官方网站:购买帆布运动鞋和经典皮鞋
2016/11/12 全球购物
《与朱元思书》的教学反思
2014/04/17 职场文书
代领毕业证委托书
2014/08/02 职场文书
团队拓展活动总结
2014/08/27 职场文书
党的群众路线教育实践活动个人对照检查材料(乡镇)
2014/11/05 职场文书
2015年党员公开承诺事项
2015/04/27 职场文书
学校食堂食品安全承诺书
2015/04/29 职场文书