js insertBefore
来源:互联网 发布:无人机测绘软件 编辑:程序博客网 时间:2024/06/14 20:59
insertBefore 插入函数 实例
<div class="btns"><input type="button" value="插入元素" id="creatbtn"/></div>
<div id="box-one"><p class="con2" id="p1">1</p>
<p class="con2">2</p>
<p class="con2">3</p>
</div>
<script language="javascript">
window.onload =function () {
var btn = document.getElementById("creatbtn");
btn.onclick =function() {
insertEle();
}
}
function insertEle() {
var oTest = document.getElementById("box-one");
var newNode = document.createElement("div");//elem-PublicConfig_showLogo01-001
var zjd_prv = document.getElementById("p1");
newNode.innerHTML =" This is a newcon ";
//oTest.appendChild(newNode);previousSibling
oTest.insertBefore(newNode,zjd_prv.previousSibling); // 这两种方法均可实现
}
</script>
这里想说的是 nextSibling :某个元素之后紧跟的元素(处于同一树层级中)。
reforeNode.nextSibling :取得的是reforeNode对象的紧跟着的下一个节点。
previousSibling - 取得某节点的上一个同级节点
由于可见insertBefore()方法的特性是在已有的子节点前面插入新的节点但是两种情况结合起来发现insertBefore()方法插入节点,是可以在子节点列表的任意位置。
0 0
- JS insertBefore
- JS insertBefore
- js insertBefore
- js insertBefore方法
- js insertBefore insertAfter appendChild
- JS:appendChild()和insertBefore()
- JS appendChild和insertBefore
- js:appendChild、insertBefore和insertAfter
- insertBefore
- inserAfter函数(js公共函数,类似insertBefore)
- JS插入节点的方法appendChild、insertBefore
- js Dom操作table添加行insertBefore
- 初学js插入节点appendChild insertBefore使用方法
- js节点内部插入元素的方法appendChild() insertBefore()
- js 动态创建并插入元素 insertBefore insertAfter
- JS(JavaScript)插入节点的方法appendChild与insertBefore
- JS(JavaScript)插入节点的方法appendChild与insertBefore
- js之DOM操作(插入节点insertBefore())
- 调用COM组件的方法
- Android 6.0 - 动态权限管理的解决方案
- 1.Ajax 简介
- 乞丐月入47万,弯腰就能捡钱……在迪拜打拼的中国人告诉你真相
- gradles sql task
- js insertBefore
- OpenCV之gpu 模块. 使用GPU加速的计算机视觉:GPU上的相似度检测(PNSR 和 SSIM)
- Python笔记01:sort min/max map/filter/reduce 列表解析 详解
- Servlet——使用http响应头Content-Disposition下载文件的示例
- javascript基础七(知识点类快速排序与函数声明函数表达式)
- 使用diff和patch制作及打补丁
- n皇后问题
- 淘淘商城的实践(4)——redis的使用
- overflow:hidden display:inline-block 行内对齐问题