您的位置:首页 > Web前端 > JavaScript

JS insertBefore

2013-03-22 13:19 288 查看
语法:

oElement = object . insertBefore ( oNewNode , oChildNode )

参数:

oNewNode :  必选项。对象(Element)。要被插入文档结构的对象。

oChildNode :  可选项。对象(Element)。定位插入点。 oNewNode 被插入到紧贴这个子对象的前面。

返回值:

oElement :  对象(Element)。返回插入的对象的引用。

说明:

将 oNewNode 插入文档结构作为 object 的子对象。即对象的 childNodes 集合的最后一项。

oNewNode 被添加前,必须先被建立。

object 没有子对象时使用此方法插入 oNewNode 不要使用 oChildNode 参数。

对于已有子对象的 object 而言,如果忽略 oChildNode 参数, oNewNode 将被插入为 object 的最后一个子对象。即 object 的 childNodes 集合的最后一项。

在运行时使用此方法是可以的。在对象的关闭标签被解析之前移除对象,则文档空间可能未被呈递。

例子一:

<script>

var iNow=3;var i_nowheight=240;

function rdl_insert(){

if (oSel.options[oSel.selectedIndex].value=="null") return;

var oNew=document.create_rElement_x("li");

eval_r("oList.insertBefore(oNew,"+oSel.options[oSel.selectedIndex].value+");");

iNow++;i_nowheight+=15;

oNew.innerText="第"+iNow.toString()+"个列表项目";

oNew.style.color="#FF3300";

window.resizeTo(320,i_nowheight);

}

</script>

<ul id=oList>

<li id=oLI1>第1个列表项目

<li id=oLI2>第2个<a href="#" onclick="return false;">列表项目</a>

<li id=oLI3>第3个列表项目

</ul>

<table><tr><td>

插入到

</td><td>

<select id="oSel" onchange="rdl_insert();">

<option value="null">---请选择---

<option value="oLI1">第1个列表项目

<option value="oLI2">第2个列表项目

<option value="oLI3">第3个列表项目

</select>

</td><td>

之前

</td></tr></table>

例子二:

<body>

<div>

<h1 id = "first">first</h1>

<h1 id="second"> second</h1>

<input type="button" onclick="test()"></input>

<div>

<script>

function test(){

var headObj = document.getElementByIdx_x("first");

var obj= document.create_rElement("H1");

var newValue = document.create_rTextNode("xin cha ru hang");

obj.a(newValue);

headObj.parentNode.insertBefore(obj,headObj);

}

</script>

</body>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: