JavaScript удалить() не работает в IE

Question

У меня есть следующий код в 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();    
} 

Я знаю, что это проблема, потому что я использовал alert('test');, чтобы увидеть, где код перестает работать. Все работает в FF, Chrome, Opera и других, но не в IE.

Не могли бы вы рассказать, что не так?

Answer 1

Уроженец childNode.remove() новый экспериментальный метод, который не поддерживается в Internet Explorer, только в Краю

Таблица совместимости с MDN

Вы могли бы использовать более широкую поддержку Node.removeChild вместо

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

или использовать polyfill from MDN, чтобы добавить поддержку для всех браузеров

(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]); 

Существует также метод remove() в JQuery, что делает работы кросс-браузер, но это потребует добавления библиотеки JQuery.

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

В getElementsByClassName работает заметка на полях только из IE9 и выше, используя querySelector бы добавить поддержку IE8, а

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

Answer 2

IE не поддерживает remove() родную функцию Javascript, но делает поддержку removeChild(). Совместимость

Browser для Вытащите()

Решение п ° 1

Использование remove() в чистом JavaScript, вы можете объявить его себе с этим следующий код:

// 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(); 

Как вы можете видеть, что функция получить родительский узел элемента, а затем удалить этот элемент из своего родителя с removeChild() родной функции.

Решения п ° 2

Использование removeChild() в чистом JavaScript на все браузер, включая IE просто называют его insteed из remove().

element.removeChild(child); 

More info в Mozilla Developer Network.

Решение п ° 3

Использование JQuery через code.jquery.com CDN с помощью этого следующий код:

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

функция включена в библиотеку JQuery, так что вы можете назвать его после включения.

Счастливое кодирование! :-)

Answer 3

Вот что я должен был сделать для того, чтобы работать в IE

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