insertBefore()

insertBefore()insertBefore()方法将把一个给定的节点插入到一个给定元素节点的给定子节点前面,他返回一个指向新增子节点的引用指针:如上所示,节点newNode将被插入元素节点element并出现在节点t

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

insertBefore()方法将把一个给定的节点插入到一个给定元素节点的给定子节点前面,他返回一个指向新增子节点的引用指针:

reference = element.insertBefore(newNode,targetNode);

如上所示,节点newNode将被插入元素节点element并出现在节点targetNode的前面。节点targetNode必须是element元素的一个子节点。如果targetNode节点未给出,newNode节点就将被追加为element元素最后一个子节点—–从效果看,这相当于调用appendChild()的方法。

insertBefore()方法通常与createElement()和createTargetNode()方法配合使用,以便把新创建的节点插入到文档树里。

在下例中,某文档有个id属性值是content的元素,这个元素又包含着一个id属性值是fineprint,我们将用createElement()方法创建一个新的文本段元素,再把新建元素插入到content元素所包括的fineprint元素的前面:

var container = document.getElement.ById("content");
var message = document.getElementById("fineprint");
var para = document.createElement("p");
container.insertBefore(para,message);

如果被插入的元素本身还有子节点,那些子节点也被插入到目标节点里面:

var container = document.getElementById("content");
var message = document.getElementById("fineprint");
var para = document.createElement("p");
var text = document.createTextNode("Here cones the fineprint");
para.appendChild(text);
container.insertBefore(para,message);

insertBefore()方法不仅可以用来插入新创建元素,还可以用来挪动文档中的现有节点。

在下例中,某个文档有一个id属相值是content的元素,在这个元素有包含一个id属性值是fineprint的元素,在这个文档的其他地方还有一个id属性值是headline的元素。在找这个元素后,最后一条语句把headline元素移动到content的元素所包含的fineprint元素的前面:

var container = document.getElementById("content");
var messge = document.getElementById("fineprint");
var announcement = document.getElementById("headline");
container.insertBefore(announcement,message);

注意,id属性值是headline的元素将先从文档书上面被移除,然后再被重新插入到新的位置,即content元素所包含的fineprint元素前面。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/167624.html原文链接:https://javaforall.net

(0)
上一篇 2022年8月2日 上午8:00
下一篇 2022年8月2日 上午8:00


相关推荐

  • 解决win10下VM12虚拟机桥接模式不能上网的方法(亲测可行)[通俗易懂]

    解决win10下VM12虚拟机桥接模式不能上网的方法(亲测可行)[通俗易懂]解决win10下VM12虚拟机桥接模式不能上网的方法(亲测可行)本文的方法可解决如下两个问题:局域网中其他机器ping不通本机中的虚拟机本机中的虚拟机采用桥接模式不能上网,甚至主机也不能上网。注意:自己局域网的IP起始地址及路由器地址,可以通过登陆路由器查看,也可以在所有操作之前在CMD中通过命令ipconfig(windows)或ifconfig(linux)查看。一般路由器的地…

    2022年6月10日
    42
  • 海康ehome协议及应用

    海康ehome协议及应用本文介绍了 ehome 协议以及在实际中的应用

    2026年3月18日
    1
  • 删除数组中指定位置的元素_js数组remove指定元素

    删除数组中指定位置的元素_js数组remove指定元素转载:http://www.php.cn/js-tutorial-412053.html

    2022年8月11日
    13
  • 给 Pycharm 安装 pytorch

    给 Pycharm 安装 pytorch问题在之前的文章Win10通过Anaconda下载安装PyTorch中,用Anacondaprompt在base环境中安装了PyTorch,并且能在Jupyternotebook中调用。但遇到了两个问题:使用Pycharm创建新project时,envs目录下找不到pytorch的选项;在Pycharm中运行>>>importtorch报错“Couldnotfindcondaenvironment:torch”

    2022年8月27日
    11
  • matplotlib无法显示图片_pycharm不出图

    matplotlib无法显示图片_pycharm不出图在学习Matplotlib的时候,在Pycharm中运行的时候不会弹出画的图像。首先你运行之后最小化pycharm,看看是不是已经出来了,只是没有自己弹到最顶层。 代码如下: importnumpyasnpimportmatplotlib.pyplotaspltdefmain():#线的绘制x=np.linspace(-np.p…

    2022年8月25日
    11
  • Oracle NUMBER类型细讲

    Oracle NUMBER类型细讲1>.NUMBER类型细讲:Oraclenumberdatatype语法:NUMBER[(precision[,scale])]简称:precision–>p     scale    –>sNUMBER(p,s)范围:1保存数据范围:-1.0e-130保存在机器内部的范围:1~22bytes有效为:从左边第一个不为0的数算起的位数。s的情况:s>0  

    2022年7月24日
    12

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号