DOM插入节点

Myth丶恋晨 2022-05-12 00:14 296阅读 0赞

**一 介绍**

插入节点通过使用insertBefore()方法来实现。

insertBefore()方法将在另一个子节点前插入新的子节点。

obj.insertBefore(new,ref)

new：表示新的子节点。

ref：指定一个节点，在这个节点前插入新的节点。

**二 应用**

插入节点，本示例在页面的文本框中输入需要插入的文本，然后通过单击“前插入”按钮将文本插入到页面中。

**三 代码**

<head>
    <title>插入节点</title>
    <script language="javascript">
     
    </script>
    </head>
    <body>
     <h2 id="h">在上面插入节点</h2>
     <form id="frm" name="frm">
     输入文本：<input type="text" name="txt" />
     <input type="button" value="前插入" οnclick="insetNode('h',document.frm.txt.value);" />
     </form>
    </body>

** **

**四 运行结果**

![fbf7425b-e554-3a99-9dd6-98105d23a023.png][]

[fbf7425b-e554-3a99-9dd6-98105d23a023.png]: /images/20220512/d37edc4d79be4f25ab190e81f3e56309.png

发表评论取消回复

表情：

评论列表（有 0 条评论，296人围观）

还没有评论，来说两句吧...

相关阅读

相关 DOM节点类型

文档的不同组成部分有不同的节点类型，共有12种，具体如下： <table style="border-style:solid; border-color:rgb(170,17

你的名字/ 2022年08月20日 08:29/ 0 赞/ 171 阅读

相关 DOM节点属性

1.getAttribute("属性") 2.setAttribute ("属性"，"属性值") 属性可视为元素节点的子节点 3.c

末蓝、/ 2022年06月14日 05:36/ 0 赞/ 317 阅读

相关 DOM 节点方法

DOM节点方法 1.createElement() 创建元素节点 2.creatTextNode() 创建文本节点

- 日理万妓/ 2022年06月14日 05:36/ 0 赞/ 258 阅读

相关 DOM替换节点

一介绍替换节点可以使用replaceChild()方法来实现。 replaceChild()方法用来将旧的节点替换成新的节点。 obj. replaceChild(n

拼搏现实的明天。/ 2022年05月12日 00:14/ 0 赞/ 240 阅读

相关 DOM复制节点

一介绍复制节点可以使用cloneNode()方法来实现。 cloneNode()方法用来复制节点。 obj.cloneNode(deep) deep：该参数是

一时失言乱红尘/ 2022年05月12日 00:14/ 0 赞/ 259 阅读

相关 DOM删除节点

一介绍删除节点通过使用removeChild()方法来实现。 removeChild()方法用来删除一个子节点。 obj. removeChild(oldChild)

Bertha 。/ 2022年05月12日 00:14/ 0 赞/ 279 阅读

相关 DOM插入节点

一介绍插入节点通过使用insertBefore()方法来实现。 insertBefore()方法将在另一个子节点前插入新的子节点。 obj.insertBefore(

Myth丶恋晨/ 2022年05月12日 00:14/ 0 赞/ 297 阅读

相关 DOM节点属性

原文：[https://blog.csdn.net/yiren\_99/article/details/47843879][https_blog.csdn.net_yiren_

ゝ一纸荒年。/ 2022年02月18日 23:09/ 0 赞/ 332 阅读

相关 DOM节点的创建、插入、删除等经验集合

目录 DOM节点的创建、插入、删除各种经验集合一、DOM节点的创建 1.1 JS方法 1.1.1 HTML页面中： 1.1.2 JS页面中 1.2 JQ方法

青旅半醒/ 2021年07月24日 11:31/ 0 赞/ 399 阅读

相关 JS常见DOM节点操作示例【创建，插入，删除，复制，查找】

`DOM`含义：DOM是文档对象模型(`Document Object Model`，是基于浏览器编程的一套`API`接口，是`W3C`出台的推荐标准。其赋予了`JS`操作节点

川长思鸟来/ 2021年06月26日 16:06/ 0 赞/ 618 阅读