Menu
I have a form and try to delete it on button click.
<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<button onclick="remove()">remove</button>
<form action="test.html" class="contactForm" dir="ltr" enctype="multipart/form-data" method="post">
<ol>
<li class="csc-form-9 csc-form-element csc-form-element-textline">
<label for="field-9">Vorname</label>
<input class="inputFormText" id="field-9" name="tx_form[firstname]" type="text"/>
</li>
<li class="csc-form-10 csc-form-element csc-form-element-textline">
<label for="field-10">Nachname</label>
<input class="inputFormText" id="field-10" name="tx_form[lastname]" type="text"/>
</li>
</ol>
</form>
<script>
function remove()
{
var x = document.getElementsByClassName("contactForm");
console.log(x);
x.remove();
}
</script>
</body>
</html>
According to this article it should be possible by just calling remove() on the DOM element. However, I get:
(index):30 Uncaught TypeError: x.remove is not a function at remove ((index):30) at HTMLButtonElement.onclick ((index):7)
874
HTML DOM Element remove() The remove() method removes an element (or node) from the document.
Use the node. cloneNode() method to clone the node. Pass true into the cloneNode() method to create a deep clone of a DOM element.
You call the cloneNode() method on the element you want to copy. If you want to also copy elements nested inside it, pass in true as an argument. // Get the element var elem = document. querySelector('#elem1'); // Create a copy of it var clone = elem.
In JavaScript, an element can only be deleted from its parent. To delete one, you have to get the element, find its parent, and delete it using the removeChild method.
The getElementsByClassName method returns an array-like collection of elements, so get the element by index.
x[0].remove();
Or use querySelector method to get a single element.
var x = document.querySelector(".contactForm");
var x = document.getElementsByClassName("contactForm")[0];
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
