Comment supprimer l'élément parent en utilisant JavaScript simple..!
Comment supprimer l'élément parent et tous les nœuds respectifs en utilisant JavaScript? Je n'utilise pas jQuery ou toute autre bibliothèque. En d'autres termes, j'ai un élément et lorsque l'utilisateur clique dessus, je veux supprimer le parent de l'élément parent (ainsi que les enfants respectifs des nœuds).
<table id='table'>
<tr id='id'>
<td>
Mohit
</td>
<td>
23
</td>
<td >
<span onClick="edit(this)">Edit</span>/<span onClick="delete_row(this)">Delete</span>
</td>
<td style="display:none;">
<span onClick="save(this)">Save</span>
</td>
</tr>
</table>
Maintenant,
function delete_row(e)
{
e.parentNode.parentNode.removeChild(e.parentNode);
}
Ne supprimera que le dernier <td>.
Comment puis-je supprimer le <tr> directement>?
e.parentNode.parentNode.getAttribute('id')
Renvoie l'id de la ligne...
Y a-t-il une fonction comme remove() ou delete() ?
5 réponses
Changez votre fonction comme ceci:
function delete_row(e)
{
e.parentNode.parentNode.parentNode.removeChild(e.parentNode.parentNode);
}
node.parentNode.parentNode.removeChild(node.parentNode)
Edit : vous devez supprimer parent de parent, alors ajoutez-en un de plus .parentNode
node.parentNode.parentNode.parentNode.removeChild(node.parentNode.parentNode)
, Ou pour ceux qui aiment un one-liner
<button onClick="this.parentNode.parentNode.removeChild(this.parentNode);">Delete me</button>
Je sais que c'est un peu trop tard, mais quelqu'un d'autre pourrait trouver utile.
Juste écrit une fonction pour cela.
Changez ceci:
onClick="delete_row(this)"
À ceci:
onClick="removeParents(this, document.getElementById('id'))"
function removeParents(e, root) {
root = root ? root : document.body;
var p = e.parentNode;
while(root != p){
e = p;
p = e.parentNode;
}
root.removeChild(e);
}
Fonction Simple pour le faire avec ES6:
const removeImgWrap = () => {
const wrappedImgs = [...document.querySelectorAll('p img')];
wrappedImgs.forEach(w => w.parentElement.style.marginBottom = 0);
};