ホームページ > 記事 > ウェブフロントエンド > JavaScriptでノードを削除する方法
JavaScriptでノードを削除する方法
- 青灯夜游オリジナル
- 2021-04-01 15:24:2312166ブラウズ
ノードを削除する Javascript メソッド: 1. Remove() メソッドを使用します。このメソッドは、すべてのテキスト ノードと子ノードを含む、親ノード上のすべての要素を削除するために使用できます。2. RemoveChild() メソッドを使用します。 、親ノード、の子ノードを削除するために使用できます。
このチュートリアルの動作環境: Windows 7 システム、ECMAScript バージョン 5、Dell G3 コンピューター。
JavaScript では、removeChild() メソッドまたは Remove() メソッドを使用してノードを削除できます。
1. ノードを削除するには、removeChild() を使用します。
removeChild() メソッドは、指定された要素の指定された子ノードを削除します。削除されたノードを Node オブジェクトとして返します。ノードが存在しない場合は null を返します。
構文
node.removeChild(node)
ノード: 必須。削除するノード オブジェクト。
例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<ul id="myList"><li>Coffee</li><li>Tea</li><li>Milk</li></ul>
<p id="demo">单击按钮移除列表的第一项</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
var list=document.getElementById("myList");
list.removeChild(list.childNodes[0]);
}
</script>
</body>
</html>レンダリング:
[推奨学習: js Basicチュートリアル]
2.remove() メソッドを使用してノードを削除します
remove() メソッドを使用して、親ノード上のすべての要素を削除できます、すべてのテキストと子ノードを含みます。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<ul style="border: 2px dashed #006DAF;">
<li>Get Up in Morning</li>
<li>Do some exercise</li>
<li>Get Ready for school</li>
<li>Study Daily</li>
<li>Do homework</li>
</ul>
<input id="btn" type="button" value="删除子节点">
</body>
<script>
function deleteChild() {
var e = document.querySelector("ul");
var first = e.firstElementChild;
while (first) {
first.remove();
first = e.firstElementChild;
}
}
var btn = document.getElementById("btn").onclick = function() {
deleteChild();
}
</script>
</html>レンダリング:
プログラミング関連の知識の詳細については、プログラミング ビデオをご覧ください。 ！
以上がJavaScriptでノードを削除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。