JavaScript随手记之insertBefore

最新推荐文章于 2021-10-23 21:27:24 发布
最新推荐文章于 2021-10-23 21:27:24 发布
阅读量269 收藏
点赞数
分类专栏： # JavaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Wind_waving/article/details/88132276
版权

最初学习用insertBefore(new,old)函数操作DOM节点时总是没有作用，后来才发现原来使用insertBefore的对象必须是当前节点的parentNode,比如以下HTML：

<div id="parent">
    <div id="child">text</div>
</div>

如果要在id为child的元素(curnode)前面添加一个标签，假设为要添加的标签创建的节点名为benode，则要用parent.insertBefore(benode,curnode)

 

风兮w
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaScript：createElement和insertBefore
01-07
obj = document.createElement(tag)创建一个标签，oParent.appendChild(obj)和oParent.insertBefore(obj,element)都是由要插入的标签的父节点调用，appendChild将创建的元素依次加在后面，而insertBefore则可以将创建的特定插在特定元素element前面 点击一下“创建LI”按钮，则HTML页面上增加一个 标签 第一步：创建 第二步：添加   两种方式 createElement和appendChild完整示例 learn js [removed] = function(){
JavaScript之appendChild、insertBefore和insertAfter使用说明
10-28
几天需要用到对HTML节点元素的删/插操作，由于用到insertBefore方法的时候遇到了一些麻烦，现在作为知识的整理，分别对appendChild、insertBefore和insertAfter做个总结
JavaScript 使用insertBefore()在某元素的前/后加入元素
thyyyyyyyy的博客
04-30 3836
定义和用法 insertBefore() 方法可以在您指定的已有子节点之前插入新的子节点 用此方法把 <!DOCTYPE html> <html> <body> <p id="demo">这是节点0。<span>这是节点1。</span></p> <button onclick="addText()"&gt...
javascript insertBefore( )
cvper's world !
03-31 6833
js DOM 操作----insertBefore( ) 的用法；含义：在某个元素之前插入一个新的元素；先来写一个带有三个段落的网页：&lt;!doctype html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;insertBefore()&lt;/title&
javascript当中insertBefore的用法
mark_to_win的专栏
03-29 1570
例 1.3（insertBeforeIEFF.html）<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/>&l...
javascript 之 insertBefore insertAfter
06-29 191
这几天需要用到对HTML节点元素的删/插操作，由于用到insertBefore方法的时候遇到了一些麻烦，现在作为知识的整理，分别对 appendChild、insertBefore和insertAfter做个总结 appendChild定义 appendChild(newChild: Node) : Node Appends a node to the childNodes arra...
javascript中的insertBefore和appendChild以及insertAfter(DOM中是没有提供的)
qq_38613228的博客
02-11 497
一、Node.insertBefore()     Node.insertBefore()方法在参考节点之前插入一个拥有指定父节点的子节点，如果给定的子节点是对文档中现有节点的引用，insertBefore()会将其从当前位置移动到新位置（在将节点附加到其他节点之间，不需要从其父节点删除该节点）。     意味着一个节...
javascript中insertAfter()和insertBefore()函数
LeapMotion1的博客
12-05 6281
//利用js提供的insertBefore及过滤器nextSibling\parentNode等function insertAfter(newElement, targetElement) { var parent = targetElement.parentNode; //如果要插入的目标元素是其父元素的最后一个元素节点，直接插入该元素 //否则，在目标元素的下一个兄弟元
JavaScript 插入节点insertBefore()
景上 的博客
07-01 3853
插入节点insertBefore()insertBefore() 方法可在已有的子节点前插入一个新的子节点。语法: insertBefore(newnode,node);参数: newnode: 要插入的新节点。 node: 指定此节点前插入节点。实现创建一个新li标签，内容为”php”,并将新创建的li插入到内容为HTML的标签前。<!DOCTYPE HTML> <html> <head>
在容器最前面添加DOM元素 parent.insertBefore(new, parent.children[0])
weixin_30237281的博客
11-11 296
//判断容器当前有没有子级元素,如果没有直接appendChild就行了; if (p.children[0]) { p.insertBefore(span, p.children[0]); } else { p.appendChild(span); } 转载于:http...
js insertBefore方法
u012901416的专栏
06-29 782
[size=medium]语法：[/size] [code="js"]oElement = object . insertBefore ( oNewNode , oChildNode )[/code] [size=medium] 参数： oNewNode :　 必选项。对象(Element)。要被插入文档结构的对象。 oChildNode :　 可选项。对象(Element)。定位插...
jQuery before和insertBefore区别
taoerchun的专栏
09-30 4747
jQuery 中利用before和insertBefore可以达到在指定元素前插入指定内容，写法上有区别 先看一个例子： 在toInsertContent前面插入toInsertContent 实现： $('toInsertContent').insertBefore($('.div1')); 或者 $('.div1').before('toInsertCont
【笔记】js parentsNode,lastChild,appendChild,insertBefore,nextSibling的意义及运用
weixin_30685029的博客
10-19 212
这几天看书看到这几个属性做几个笔记 parentNode：顾名思义，就是获取某元素的父元素等同于jq的parent(). *注意一下，在调用parentNode 方法的时候 调用的对象必须是用ID 或是精确地获取的对象（要么getElementById 要么 ByTagName然后加上获取对象的下标[index]），不然会出现undefined 的错误 lastChild：获取最后一...
JS DOM 编程复习笔记 -- insertBefore、insertAfter、append、prepend（七）
小帅的编程笔记
10-23 922
今天我们来继续来复习DOM的一些插入方法，insertBefore()，append()和prepend()方法。前面我们只用到过一个appendChild()方法。我们一个个看语法和示例，包你看完就会。 insertBefore() insertBefore()用来在指定的DOM节点前插入DOM元素。 语法： parentNode.insertBefore(newNode, existingNode); parentNode为existingNode的父节点 existingNode为已经存在的节点 n
javascript 基础 insertAfter与insertBefore
老刘的日志博客
01-08 494
1. parent.insertBefore(newElement,targetElement.nextSibling)他的三部分为 父节点 新节点 目标节点 他会把新节点创建在目标节点之前 需要注意的是 父节点并无需获取 你通过目标节点.parentNode就可以获取 但是js并没有提供插入在目标节点之后的方法 我们可以自己写一个function insertAfter(newElement,t
js的动态插入指定位置的标签方法insertBefore，以及自定义insertAfter方法
开发路上的AZhe
07-28 4744
var mydiv = document.getElementById("mydiv");//目标元素 var divimg = document.createElement("div"); //新建一个div标签 divimg.classList.add("productInformation-img"); //给div定义一个类名 这里用来...
4_9.DOM--添加删除替换元素
BWater_monster的博客
03-24 271
创建元素 使用JS可以为一个已有的元素添加一个新的子元素 1.创建空元素 var elem=document.creatElement(“标签名”) 元素创建后，可以像使用DOM树种的任意元素一样，为此元素添加属性或 内容 elem.id=“xxx” elem.innerHTML=“xxx” 注意：元素创建完成后，知识在内存中保存，并没有添加到DOM树 2.将新创建的元素添加到DOM树的指定父元素...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值