使用JavaScript中document对象-方法创建元素

最新推荐文章于 2024-08-26 17:50:05 发布

J78807

最新推荐文章于 2024-08-26 17:50:05 发布

阅读量505

点赞数

文章标签： javascript

本文链接：https://blog.youkuaiyun.com/J78807/article/details/127342996

版权

本文介绍了一种在HTML页面中创建并设置自定义`p`标签的方法。通过JavaScript代码，实现了标签的创建、文本内容的添加、属性的设定以及将新元素添加到指定位置的过程。此方法适用于网页动态内容更新。

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="sq"></div>
<div id="sa"></div>
<script>

// 要创建一个标签，并加上文本和属性有八步
// 先创建这个标签
var num1 = document.createElement("p")
// 其次创造一个文本
var num_txt = document.createTextNode("这是我的p标签")
// 然后把这个文本塞入这个标签里
num1.appendChild(num_txt)
// 再创建一个属性
var num_a = document.createAttribute("class");
// 给这个属性名一个名字;
num_a.value="abc"
// 把这个名字放到我创建的标签里
num1.setAttributeNode(num_a)
// 要让它能在页面里显示，需要把它放在<body>中的某个部分
// 所以要获取里面一个标签
var help = document.getElementById("sa")
// 最后用appendChild插入即可
help.appendChild(num1)

</script>
</body>
<cml>