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元素前面。

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

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

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • UML——概述

    UML——概述UML——概述

  • python的dropna_python–data.dropna[通俗易懂]

    python的dropna_python–data.dropna[通俗易懂]读取csv文件data=pd.read_csv(“”)1、删除全为空值的行或列data=data.dropna(axis=0,how=’all’)#行data=data.dropna(axis=1,how=’all’)#列2、删除含有空值的行或列data=data.dropna(axis=0,how=’any’)#行data=data.dropna(axis=1,how=’an…

  • 监控平台技术调研

    监控平台技术调研强烈推荐一个大神的人工智能的教程:http://www.captainbed.net/zhanghan【前言】随着业务不断迅速的扩展,我们的项目越来越多,越来越复杂;随之而来的是系统各种问题一直在困扰着我们;经过去网上调研以及之前的经验,我们决定引入监控平台;很庆幸自己能成为该技术的前期研究者;经过自己的调研以及实践,将监控平台从无到有搭建起来,目前正在各个系统中进行推广。…

  • linux部署kafka_linux无法启动kafka

    linux部署kafka_linux无法启动kafka这是一套从零开始搭建kafka集群的笔记,我几乎帮你踩了所有的坑

    2022年10月14日
  • zuul网关作用_zuul网关的作用

    zuul网关作用_zuul网关的作用Zuul网关使用步骤1.在父项目中导入依赖SpringCloud管理<dependencyManagement><dependencies><dependency><groupId>org.springframework.cloud</groupId><artifactId>spring-cloud-dependencies&

  • 工厂供电复习笔记

    工厂供电复习笔记概述什么是电网,电网怎么区分。基本概念熟练掌握。1.2电力系统接线方式和电压等级电压等级每年都考,一些基本的概念。有一张图,给一些相关参数算其他没给的参数。长线短线中性点运行方式相当重要中性点不解地,某一相不解地,为什么还能继续工作。中性点为什么经过消弧线圈接地,进位对地电流超过多少就需要。中性点为什么经小电阻接地。中性点直接接地。TN-C系统外壳带电怎么办TN-S系统TN-C-S系统市电就是这三种系统TN系统,中性线接地,有什么作用:ppt三条TT系统IT系统第二章工

发表回复

您的电子邮箱地址不会被公开。

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