Cómo eliminar el elemento principal utilizando javascript ...!

Question

¿Cómo elimino el elemento principal y todos los nodos respectivos utilizando JavaScript plano? No estoy usando jQuery o cualquier otra biblioteca. En otras palabras, tengo un elemento y cuando el usuario hace clic en él, quiero eliminar el elemento principal del elemento principal (así como los nodos secundarios respectivos).

<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>  

Ahora,

function delete_row(e) 
{ 
    e.parentNode.parentNode.removeChild(e.parentNode); 
} 

eliminará sólo duran <td>.

¿Cómo elimino el <tr> directamente>?

e.parentNode.parentNode.getAttribute('id') 

devuelve el identificador de la fila ...

¿Hay alguna función como remove() o delete()?

Answer 1

Cambiar su función como esta:

function delete_row(e) 
{ 
    e.parentNode.parentNode.parentNode.removeChild(e.parentNode.parentNode); 
} 

Answer 2

node.parentNode.parentNode.removeChild(node.parentNode) 

Editar: Es necesario eliminar los padres de los padres, por lo que añadir una más .parentNode

node.parentNode.parentNode.parentNode.removeChild(node.parentNode.parentNode) 

Answer 3

Sé que es una poco tarde, pero alguien más puede encontrarlo útil.
Acabo de escribir una función para eso.

cambiar esta situación:

onClick="delete_row(this)" 

A esto:

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); 
} 

http://jsfiddle.net/emg0xcre/

Answer 4

O para aquellos que gustan de un sola línea

<button onClick="this.parentNode.parentNode.removeChild(this.parentNode);">Delete me</button> 

Answer 5

función simple de hacer esto con ES6:

const removeImgWrap =() => { 
    const wrappedImgs = [...document.querySelectorAll('p img')]; 
    wrappedImgs.forEach(w => w.parentElement.style.marginBottom = 0); 
};