JavaScript 给HTML DOM 添加新元素

最新推荐文章于 2024-03-09 14:57:39 发布

AirZilong

最新推荐文章于 2024-03-09 14:57:39 发布

阅读量2.7k

点赞数

CC 4.0 BY-SA版权

分类专栏： React Native 文章标签： javascript

本文链接：https://blog.youkuaiyun.com/Arodung/article/details/78904834

React Native 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一个使用JavaScript向HTML页面中动态添加新元素的例子。通过创建新的`<p>`标签并将其添加到指定的`div`元素中，展示了如何利用`document.createElement`、`document.createTextNode`及`appendChild`等方法来实现DOM的动态更新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

学习RN之前，对JS的储备知识：给HTML DOM 添加新元素，所以要添加标签，记录学习过程

<!DOCTYPE html>
<html>
<body>

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>

<script>
var para=document.createElement("p");
var node=document.createTextNode("添加一个airzilong");
para.appendChild(node);

var element=document.getElementById("div1");
element.appendChild(para);
</script>

<script> 
var para=document.createElement("p");
var node=document.createTextNode("我是最新的airzilong");
para.appendChild(node);

var element=document.getElementById("div1");
element.appendChild(para);
</script>

</body>
</html>

如果转载请注明转于： AirZilong的博客