js在指定位置增加节点函数insertBefore()用法实例


Posted in Javascript onJanuary 12, 2015

本文实例讲述了js在指定位置增加节点函数insertBefore()用法。分享给大家供大家参考。具体分析如下:

函数原型如下:

insertBefore(参数1,参数2):在指定位置添加节点

具体代码如下:

<html>

<head>

<script type="text/javascript">

function t(){

 var nodeli = document.createElement('li');//创建一个li节点

 var li_text = document.createTextNode('蓝天');//创建一个文本节点

 nodeli.appendChild(li_text);//将文本节点追加到li节点上

 

 var nodeul = document.getElementsByTagName('ul')[0];//获取第一个UL节点

 var nodeli1 = nodeul.getElementsByTagName('li')[2];//获取ul下第3个节点——秋天

 nodeul.insertBefore(nodeli,nodeli1);//函数insertBefore()表示在哪个节点前添加。第一个参数为要插入的新节点,第二个参数为已有节点

}

</script>

</head>

<body>

<div id="container">

 <ul>

  <li>春天</li>

  <li>夏天</li>

  <li>秋天</li>

  <li>冬天</li>

 </ul>

</div>

<hr />

<button onclick="t()" value="">指定位置增加节点</button>

</body>

</html>

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

Javascript 相关文章推荐
在html页面上拖放移动标签
Jan 08 Javascript
使用jquery实现简单的ajax
Jul 08 Javascript
引入JS文件IE6报语法错误或缺少对象问题的解决方法
Jan 09 Javascript
使用POST方式弹出窗口的两种方法示例介绍
Jan 29 Javascript
jQuery实现可以控制图片旋转角度效果(附demo源码下载)
Jan 27 Javascript
判断JS对象是否拥有某属性的方法推荐
May 12 Javascript
Angularjs中$http以post请求通过消息体传递参数的实现方法
Aug 05 Javascript
深入理解Vue 的条件渲染和列表渲染
Sep 01 Javascript
JQuery 又谈ajax局部刷新
Nov 27 jQuery
小程序点赞收藏功能的实现代码示例
Sep 07 Javascript
vue用elementui写form表单时,在label里添加空格操作
Aug 13 Javascript
vue使用screenfull插件实现全屏功能
Sep 17 Javascript
jQuery制作拼图小游戏
Jan 12 #Javascript
DOM节点深度克隆函数cloneNode()用法实例
Jan 12 #Javascript
DOM节点删除函数removeChild()用法实例
Jan 12 #Javascript
原生javascript实现图片弹窗交互效果
Jan 12 #Javascript
原生javascript实现图片按钮切换
Jan 12 #Javascript
原生javascript实现图片滚动、延时加载功能
Jan 12 #Javascript
DOM节点的替换或修改函数replaceChild()用法实例
Jan 12 #Javascript
You might like
PHP对MongoDB[NoSQL]数据库的操作
2013/03/01 PHP
PHP中__FILE__、dirname与basename用法实例分析
2014/12/01 PHP
PHP使用SOAP扩展实现WebService的方法
2016/04/01 PHP
PHP性能分析工具xhprof的安装使用与注意事项
2017/12/19 PHP
thinkphp框架实现路由重定义简化url访问地址的方法分析
2020/04/04 PHP
用jquery ajax获取网站Alexa排名的代码
2009/12/12 Javascript
控制input输入框中提示信息的显示和隐藏的方法
2014/02/12 Javascript
jQuery插件MixItUp实现动画过滤和排序
2015/04/12 Javascript
Javascript 判断两个IP是否在同一网段实例代码
2016/11/28 Javascript
vue中动态绑定表单元素的属性方法
2018/02/23 Javascript
jquery登录的异步验证操作示例
2019/05/09 jQuery
[01:15]《辉夜杯》北京网鱼队巡礼
2015/10/26 DOTA
python通过smpt发送邮件的方法
2015/04/30 Python
一波神奇的Python语句、函数与方法的使用技巧总结
2015/12/08 Python
Python随机数用法实例详解【基于random模块】
2017/04/18 Python
Python生成随机密码的方法
2017/06/16 Python
Django原生sql也能使用Paginator分页的示例代码
2017/11/15 Python
Python爬虫常用小技巧之设置代理IP
2018/09/13 Python
python 用opencv调用训练好的模型进行识别的方法
2018/12/07 Python
Python实现制度转换(货币,温度,长度)
2019/07/14 Python
python应用文件读取与登录注册功能
2019/09/23 Python
python通过链接抓取网站详解
2019/11/20 Python
python 按钮点击关闭窗口的实现
2020/03/04 Python
使用Python爬取弹出窗口信息的实例
2020/03/14 Python
python各种excel写入方式的速度对比
2020/11/10 Python
伯克斯奥特莱斯:Burkes Outlet
2019/03/30 全球购物
Bose英国官方网站:美国知名音响品牌
2020/01/26 全球购物
即兴演讲稿
2014/01/04 职场文书
作弊检讨书1000字
2014/02/01 职场文书
文明村创建实施方案
2014/03/27 职场文书
基层领导干部“四风”问题批评与自我批评
2014/09/23 职场文书
市场营销计划书
2015/01/17 职场文书
《珍珠鸟》教学反思
2016/02/16 职场文书
测量JavaScript函数的性能各种方式对比
2021/04/27 Javascript
Django如何创作一个简单的最小程序
2021/05/12 Python
Python序列化与反序列化相关知识总结
2021/06/08 Python