Почему этот цикл намертво вешает вкладку?

Question

[Shimpanze]

Здравствуйте!

Мне необходимо удалить все атрибуты у всех тегов, кроме атрибута «href».

Пишу код:

// Собираю все элементы в массив
[].forEach.call(document.querySelectorAll('.post *'), function(e) {
  // Получаю все атрибуты у текущего элемента
  // и запускаю по ним цикл
  while(e.attributes.length > 0) {
    // Если текущий атрибут в цикле это НЕ «href»
    if (! e.hasAttribute(e.attributes[0].href) {
      // То удаляем его
      e.removeAttribute(e.attributes[0].name);
    }
  }
});

Вешает вкладку браузера намертво...

Answer 1

[Дмитрий Беляев]

Array.prototype.forEach.call(document.querySelectorAll('.post *'), function(e) {
  for(var i = e.attributes.length; i--;) {
    if(e.attributes[i].nodeName !== 'href') {
      e.removeAttributeNode(e.attributes[i]);
    }
  }
});

Comments

[Rsa97]

Только либо
for(var i = e.attributes.length-1; i >= 0; i--) {
либо внутри цикла надо везде указывать i-1.

[Дмитрий Беляев]

Rsa97, не нужно, ибо декримент стоит на месте условия, условие вычисляется перед итерацией, а особенность постдекримента дает возможность пробежать ровно все элементы

[Никита Егоров]

Ведь вроде необязательно писать что-то в виде этого - Array.prototype.forEach.call

querySelectorAll возвращает NodeList, а не HTMLCollection. Следовательно у него доступны все те же методы, что и у массивов.

Работать будет так же

document.querySelectorAll('.post').forEach(e => {
    for(let i = e.attributes.length; i--;) {
      	if(e.attributes[i].nodeName !== 'href') {
            e.removeAttributeNode(e.attributes[i]);
      	}
    }
});

[Rsa97]

Дмитрий Беляев, Логично, что то я тормознул.

[Дмитрий Беляев]

Никита Егоров, Это не совсем кроссбраузерно, данный метод введен в стандарт недавно
https://developer.mozilla.org/en-US/docs/Web/API/N...
хотя если использовать полифил для старых браузеров...

[Shimpanze]

Никита Егоров, А вот это хорошее замечание! Спасибо!

Answer 2

[Rsa97]

Потому что условие e.attributes.length > 0 у вас всегда истинно и цикл никогда не завершается.

Comments

[Shimpanze]

И как можно сформировать это условие?

[Rsa97]

Shimpanze, Ну-с, начнём с того, что у атрибута (объекта Attr) нет свойства href, так что непонятно, что вообще вы хотите сказать выражением e.hasAttribute(e.attributes[0].href
А реализовать это можно, например, так:

let i = 0;
while (i < e.attributes.length) 
{
  if ('href' == e.attributes[i].name) 
  { 
    i++; 
  } else { 
    e.removeAttribute(e.attributes[i].name); 
  }
}