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 相关文章推荐
Javascript &amp; DHTML 实例编程(教程)DOM基础和基本API
Jun 02 Javascript
Javascript技巧之不要用for in语句对数组进行遍历
Oct 20 Javascript
Jquery css函数用法(判断标签是否拥有某属性)
May 28 Javascript
jQuery表格列宽可拖拽改变且兼容firfox
Sep 03 Javascript
JavaScript Ajax实现异步通信
Dec 14 Javascript
Jquery Easyui表单组件Form使用详解(30)
Dec 19 Javascript
Vue在页面数据渲染完成之后的调用方法
Sep 11 Javascript
深度了解vue.js中hooks的相关知识
Jun 14 Javascript
使用js实现一个简单的滚动条过程解析
Sep 10 Javascript
浅谈layui使用模板引擎动态渲染元素要注意的问题
Sep 14 Javascript
使用webpack搭建pixi.js开发环境
Feb 12 Javascript
JavaScript编码小技巧分享
Sep 17 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文档更新介绍
2011/07/22 PHP
PHP实现小程序批量通知推送
2018/11/27 PHP
php和vue配合使用技巧和方法
2019/05/09 PHP
Javascript动态绑定事件的简单实现代码
2010/12/25 Javascript
浅析Prototype的模板类 Template
2011/12/07 Javascript
细说javascript函数从函数的构成开始
2013/08/29 Javascript
jQuery获取样式中颜色值的方法
2015/01/29 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
2015/11/17 Javascript
JavaScript编写页面半透明遮罩效果的简单示例
2016/05/09 Javascript
微信小程序 利用css实现遮罩效果实例详解
2017/01/21 Javascript
canvas实现图像放大镜
2017/02/06 Javascript
基于canvas的二维码邀请函生成插件
2017/02/14 Javascript
Angular4 反向代理Details实践
2018/05/30 Javascript
详解vue项目中如何引入全局sass/less变量、function、mixin
2018/06/02 Javascript
JS散列表碰撞处理、开链法、HashTable散列示例
2019/02/08 Javascript
jQuery实现的五星点评功能【案例】
2019/02/18 jQuery
js实现删除li标签一行内容
2019/04/16 Javascript
python3 面向对象__类的内置属性与方法的实例代码
2018/11/09 Python
深入浅析Python中的迭代器
2019/06/04 Python
tensorflow的ckpt及pb模型持久化方式及转化详解
2020/02/12 Python
Python操控mysql批量插入数据的实现方法
2020/10/27 Python
Pycharm常用快捷键总结及配置方法
2020/11/14 Python
python 实现socket服务端并发的四种方式
2020/12/14 Python
css3 条纹化和透明化表格Firefox下测试成功
2014/04/15 HTML / CSS
html5 Canvas画图教程(9)—canvas中画出矩形和圆形
2013/01/09 HTML / CSS
美国知名户外用品畅销中心:Sierra Trading Post
2016/07/19 全球购物
Dr. Martens马汀博士官网:马丁靴始祖品牌
2016/10/15 全球购物
RetroStage德国:复古服装
2019/02/03 全球购物
什么是用户模式(User Mode)与内核模式(Kernel Mode) ?
2014/07/21 面试题
五分钟演讲稿
2014/04/30 职场文书
婚庆公司计划书
2014/09/15 职场文书
2014年收银工作总结
2014/11/13 职场文书
农业项目合作意向书
2015/05/08 职场文书
JavaScript实现简单图片切换
2021/04/29 Javascript
.Net Core导入千万级数据至Mysql的步骤
2021/05/24 MySQL
「约定的梦幻岛」作画发布诺曼生日新绘
2022/03/21 日漫