servidor - JavaScript remove() no funciona en IE

safari no funciona en iphone

Question

Tengo el siguiente código en JavaScript:

all_el_ul = document.getElementsByClassName(''element_list'')[0];
div_list = all_el_ul.getElementsByTagName("div");
for (i = 0; i < div_list.length; i += 1) {         
  div_list[i].remove();             
}

Sé que este es el problema porque usé alert(''test''); Para ver donde el código deja de funcionar. Todo funciona en FF, Chrome, Opera y otros, pero no en IE.

¿Podría por favor decir qué está mal?

Answer 1

IE no es compatible con la función Javascript remove() nativa, pero sí es compatible con removeChild() .

Compatibilidad del navegador para eliminar ()

Solución n ° 1

Utilice remove() en Javascript puro, puede declararlo usted mismo con este código siguiente:

// Create Element.remove() function if not exist
if (!(''remove'' in Element.prototype)) {
    Element.prototype.remove = function() {
        if (this.parentNode) {
            this.parentNode.removeChild(this);
        }
    };
}
// Call remove() according to your need
child.remove();

Como puede ver, la función obtiene el nodo padre del elemento y luego elimina este elemento de su padre con la función nativa removeChild() .

Solución n ° 2

Use removeChild() en JavaScript puro en todos los navegadores, incluido IE, simplemente llámelo en lugar de remove() .

element.removeChild(child);

Más información sobre la red de desarrolladores de Mozilla.

Solución n ° 3

Use jQuery a través de code.jquery.com CDN usando este código siguiente:

<!-- Include jQuery -->
<script
  src="https://code.jquery.com/jquery-3.2.1.min.js"
  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
  crossorigin="anonymous"></script>
<!-- Use remove() -->
<script>
child.remove();
</script>

La función está incluida en la biblioteca jQuery, por lo que puede llamarla después de la inclusión.

¡Feliz codificación! :-)

Answer 2

Añade esto en su lugar:

if (!(''remove'' in Element.prototype)) {
  Element.prototype[''remove''] = function () {
    if (this.parentNode) {
      this.parentNode.removeChild(this);
    }
  };
}

Answer 3

El childNode.remove() nativo es un nuevo método experimental que no es compatible con Internet Explorer, solo en Edge

Tabla de compatibilidad de MDN

Podría usar el Node.removeChild más ampliamente soportado en Node.removeChild lugar

var all_el_ul = document.getElementsByClassName(''element_list'')[0];
var div_list  = all_el_ul.getElementsByTagName("div");

for (i = 0; i < div_list.length; i += 1) {         
   div_list[i].parentNode.removeChild(div_list[i]);             
}

o use el polyfill de MDN para agregar soporte para todos los navegadores

(function (arr) {
  arr.forEach(function (item) {
    if (item.hasOwnProperty(''remove'')) {
      return;
    }
    Object.defineProperty(item, ''remove'', {
      configurable: true,
      enumerable: true,
      writable: true,
      value: function remove() {
        this.parentNode.removeChild(this);
      }
    });
  });
})([Element.prototype, CharacterData.prototype, DocumentType.prototype]);

También hay un método remove() en jQuery, que funciona en todos los navegadores, pero que requeriría agregar la biblioteca jQuery.

$(''.element_list'').first().find(''div'').remove();

Como una referencia al margen, getElementsByClassName solo funciona desde IE9 en adelante, el uso de querySelector también agregará compatibilidad con IE8

var all_el_ul = document.querySelector(''.element_list'');

Answer 4

Esto es lo que tuve que hacer para que funcione en IE

if (typeof textField.remove === ''function'') {
  textField.remove();
} else {
  textField.parentNode.removeChild(textField);
}