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实现当按下回车键时绑定点击事件
Jan 28 Javascript
JS实现距离上次刷新已过多少秒示例
May 23 Javascript
解决自定义$(id)的方法与jquery选择器$冲突的问题
Jun 14 Javascript
JavaScript生成SQL查询表单的方法
Aug 13 Javascript
拥Bootstrap入怀——导航栏篇
May 30 Javascript
react-native 封装选择弹出框示例(试用ios&amp;android)
Jul 11 Javascript
js数组实现权重概率分配
Sep 12 Javascript
jquery实现楼层滚动效果
Jan 01 jQuery
vue中使用codemirror的实例详解
Nov 01 Javascript
layui扩展上传组件模拟进度条的方法
Sep 23 Javascript
javascript设计模式 ? 外观模式原理与用法实例分析
Apr 15 Javascript
多页vue应用的单页面打包方法(内含打包模式的应用)
Jun 11 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
在线短消息收发的程序,不用数据库
2006/10/09 PHP
谈谈PHP语法(4)
2006/10/09 PHP
php while循环控制的简单实例
2016/05/30 PHP
Laravel中前端js上传图片到七牛云的示例代码
2017/09/04 PHP
PHP中递归的实现实例详解
2017/11/14 PHP
PHP基于openssl实现的非对称加密操作示例
2019/01/11 PHP
ThinkPHP5.0框架结合Swoole开发实现WebSocket在线聊天案例详解
2019/04/02 PHP
ThinkPHP3.2.3框架实现执行原生SQL语句的方法示例
2019/04/03 PHP
javascript eval函数深入认识
2009/02/21 Javascript
JS如何将UTC格式时间转本地格式
2013/09/04 Javascript
js实现鼠标划过给div加透明度的方法
2015/05/25 Javascript
JavaScript使用Ajax上传文件的示例代码
2017/08/10 Javascript
使用原生js+canvas实现模拟心电图的实例
2017/09/20 Javascript
angular中两种表单的区别(响应式和模板驱动表单)
2018/12/06 Javascript
如何让node运行es6模块文件及其原理详解
2018/12/11 Javascript
如何将百度地图包装成Vue的组件的方法步骤
2019/02/12 Javascript
JS实现可用滑块滑动的缓动图代码
2019/09/01 Javascript
浅谈vuex中store的命名空间
2019/11/08 Javascript
Vue列表如何实现滚动到指定位置样式改变效果
2020/05/09 Javascript
[01:56]无止竞 再出发——中国军团出征2017年DOTA2国际邀请赛
2017/07/05 DOTA
python实现判断数组是否包含指定元素的方法
2015/07/15 Python
使用Python的turtle模块画图的方法
2017/11/15 Python
python调用系统ffmpeg实现视频截图、http发送
2018/03/06 Python
浅析Python语言自带的数据结构有哪些
2019/08/27 Python
国际性能运动服装品牌:Dare 2b
2018/07/27 全球购物
Perfume’s Club英国官网:购买香水和护肤品
2019/11/02 全球购物
JDK安装目录下有哪些内容
2014/08/25 面试题
AJAX的全称是什么
2012/11/06 面试题
乡村卫生服务一体化管理实施方案
2014/03/30 职场文书
安全教育演讲稿
2014/05/09 职场文书
自习课吵闹检讨书范文
2014/09/26 职场文书
计划生育个人总结
2015/03/02 职场文书
2015年店长个人工作总结
2015/10/23 职场文书
用Python selenium实现淘宝抢单机器人
2021/06/18 Python
SpringCloud的JPA连接PostgreSql的教程
2021/06/26 Java/Android
MySQL子查询中order by不生效问题的解决方法
2021/08/02 MySQL