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

本文实例讲述了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程序设计有所帮助。

赞 (0)

相关推荐

  • js使用for循环与innerHTML获取选中tr下td值

    function getParentEl (el, tagName) { if (!el) return el; do { el = el.parentNode; } while(el && el.tagName !== tagName); return el; } function temp(){ //得到选中row的value值 var temp=document.getElementsByName('id'); for(var i=0;i<temp.length;i++){ i

  • js字符串的各种格式的转换 ToString，Format

    如果我们都计算出对的格式,然后再显示的话,显然浪费代码和效率,今天看见了许多ToString可以解决的格式,总结给大家,希望可以方便大家. 1.转换钱的格式,仅限int型,float型,double型 double d = 400; d.ToString("C"); //￥400.00 2.10进制数,仅限int型的数字 int i=400; i.ToString("D5"); // 00400 3.科学型数字,仅限int型,float型,double型 float

  • 在Linux上用forever实现Node.js项目自启动

    那么能否利用forever加启动脚本方式解决上述问题呢?答案当然是肯定的,只不过有点麻烦,而且forever官方缺少详细的配置文档.我在配置的时候也走了一些弯路,下面详细来说. 注:本文的实验环境是Ubuntu Server 12.04 LTS x86_64,在CentOS上的配置更简单一些 最早,我想着试试在/etc/rc.local中增加一句forever start xxx看看,结果发现Ubuntu(其他系统一样)就不鸟我,主要矛盾就是mongodb使用这种方式就可以跑起来,forever

  • Javascript for in的缺陷总结

    Javascript for in的缺陷总结 for in 语句用来列举对象的属性(成员),如下 var obj = { name:"jack", getName:function(){return this.name} }; //输出name,getName for(var atr in obj) { alert(atr); } 注意了吗,没有输出obj的toString,valueOf等内置属性(或称内置成员,隐藏属性和预定义属性).即for in用来列举对象的显示成员(自定义成员

  • 关于js中for in的缺陷浅析

    for in 语句用来列举对象的属性(成员),如下 复制代码 代码如下: var obj = { name:"jack",      getName:function(){return this.name}};//输出name,getName    for(var atr in obj) {    alert(atr);} 注意了吗,没有输出obj的toString,valueOf等内置属性(或称内置成员,隐藏属性和预定义属性).即for in用来列举对象的显示成员(自定义成员). 如

  • javascript 循环语句 while、do-while、for-in、for用法区别

    前两个唯一的差别就是循环和判断的顺序不同,do-while比while多循环一次,我就不举例了. for循环相信大家也熟的不能再熟了,我们就看for-in这一句. 这个其实是针对数组的,js中数组的初始化也挺奇特的比如我们在script结点里写:(另外注意下数组的初始化,用的是中括号) "); var a=[3,4,5,7]; for(var test in a){ document.write(test+": "+a[test]+""); } -->

  • 得到form下的所有的input的js代码

    使用form 的集合对象elements,从而得到value 复制代码 代码如下: var form = document.getElementById("dateform"); var a = form.elements.length;//所有的控件个数 for (var j=0;j<a;j++){ if(form.elements[j].className == "text"){//class="text"的控件 if(form.ele

  • 为javascript添加String.Format方法

    复制代码 代码如下: String.format = function() { if( arguments.length == 0 ) { return null; } var str = arguments[0]; for(var i=1;i<arguments.length;i++) { var re = new RegExp('\\{' + (i-1) + '\\}','gm'); str = str.replace(re, arguments[i]); } return str; } 使

  • JavaScript中for-in遍历方式示例介绍

    摘要:for-in遍历方式的循环计数器是字符串类型,遍历对象时为对象属性/方法名,遍历数组时为数组元素下标索引,与普通的for循环不同,for-in会将继承的属性/方法列出,这一点在使用时需要特别关注. 除了传统的for循环,JavaScript为遍历操作定义了for-in方式,根据数据源的不同,在使用时存在差异. (1)遍历对象: 复制代码 代码如下: var fish = { head : 1, tail : 1, } for(var prop in fish) { console.log(

  • JavaScript中for..in循环陷阱介绍

    大家都知道在JavaScript中提供了两种方式迭代对象: (1)for 循环: (2)for..in循环: 使用for循环进行迭代数组对象,想必大家都已经司空见惯了.但是,使用for.. in循环时,大家可要注意了,为什么这么说呢?大家听我娓娓道来.... javascript提供了一种特殊的循环(也就是for .. in循环),用来迭代对象的属性或数组的每个元素,for...in循环中的循环计数器是字符串,而不是数字.它包含当前属性的名称或当前数组元素的索引. 案例一: 复制代码 代码如下:

随机推荐