ホームページ > 記事 > ウェブフロントエンド > JavaScriptにp要素を追加する方法
JavaScriptにp要素を追加する方法
- 青灯夜游オリジナル
- 2022-02-08 14:36:393910ブラウズ
JavaScript で p 要素を追加する方法: 1. "document.createElement("p")" ステートメントを使用して、新しい p 要素ノードを作成します。 2. "parent node.appendChild(p element node)" を使用します。 )" ステートメント 新しく作成された p ノードを指定された親ノードに追加します。
このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。
JavaScript による p 要素の追加
実装アイデア:
1. document.createElement() を使用してノードを作成します
2. 親の Element.appendChild (子要素) メソッドを使用して、作成したノードを親ノードに追加します
実装コード:
<!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 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。