JavaScript怎麼增加p元素
- 青灯夜游原創
- 2022-02-08 14:36:393997瀏覽
JavaScript增加p元素的方法：1、使用「document.createElement("p")」語句建立一個新的p元素節點；2、使用「父節點.appendChild(p元素節點)」語句將新建立的p節點新增到指定父節點。
本教學操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。
JavaScript增加p元素
實作想法：
1、利用document.createElement()建立一個節點
2、把建立的節點利用父Element.appendChild(子element)方法加入父節點
實作程式碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
p{
height: 20px;
border: 1px solid red;
}
</style>
</head>
<body>
<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>
<button onclick="myFunction()">添加p元素</button>
<script>
function myFunction() {
var para = document.createElement("p"); //创建新的<p> 元素
var node = document.createTextNode("这是一个新段落。"); //创建文本节点
para.appendChild(node); //向 <p> 元素追加这个文本节点
//向已有的元素追加这个新元素
var element=document.getElementById("div1");
element.appendChild(para);
}
</script>
</body>
</html>
以上是JavaScript怎麼增加p元素的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn