Как исключить элемент из массива в JS?

229
19 января 2019, 02:10

Есть такой скрипт

(function () {
  var spoilers = [].slice.call(document.querySelectorAll('.spoiler-wrap,.sp-wrap,.sp-head'));
  if (!spoilers.length) {
    return;
  }
  var btn = document.createElement('button');
  btn.type = 'button';
  btn.innerHTML = 'Открыть все спойлеры';
  btn.addEventListener('click', function () {
    spoilers.forEach(function (node) {
      node.querySelector('.clickable').dispatchEvent(new Event('click'));
    });
  });
  spoilers[0].insertAdjacentHTML('beforebegin', '<br>');
  spoilers[0].insertAdjacentHTML('beforebegin', '&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp');
  spoilers[0].parentNode.insertBefore(btn, spoilers[0]);
})();

открывающий все спойлеры на странице. Можно ли сделать так, чтобы открывались все, кроме тех (их два), которые не нужно открывать?

Разметка не нужных:

td.row1 table[id^="post_"] style+table.btTbl div.center .spoiler-wrap

Нужные спойлеры имеют такую разметку

tr.row2 td.row2 table[id^="post_"] div.postbody .spoiler-wrap

В полной версии ненужные спойлеры "Список файлов в торренте" и "Похожие темы" Полная версия

Разметка ненужных спойлеров в оригинале

<div align="center">
  <div class="spoiler-wrap" style="width: 95%; margin: 6px auto; clear: both; border: solid #6699CC; background: #D0DFEF; border-width: 1px 1px 1px 2px;" onmousedown="var d=document.getElementById('contentdiv');if(!d.flDone){ajax_do('filelst.php?attach_id=757422');}"
    align="center">
    <div class="spoiler-head folded clickable">Список файлов в торренте</div>
    <div class="spoiler-body" id="contentdiv" style="border-top:1px solid #6699CC; background: #F4F8FB; padding: 1px 6px 2px; display: none;overflow:auto;max-height:350px;" title="">&nbsp;</div>
    <div class="clear"></div>
  </div>
</div>
<div id="simil"></div>
<div align="center">
  <div class="spoiler-wrap" style="width: 95%; margin: 6px auto; clear: both; border: solid #6699CC; background: #D0DFEF; border-width: 1px 1px 1px 2px; font-weight: bold;" align="center">
    <div class="spoiler-head folded clickable">Похожие темы (2992 совп.; «k, авторск, раздач»):</div>
    <div class="sim spoiler-body" style="border-top:1px solid #6699CC; background: #F4F8FB; padding: 1px 6px 2px; display: none;" title="">
Answer 1

Простое решение, просто не добавлять ненужные элементы в выборку.

Например расширив селектор: document.querySelectorAll('div.postbody .spoiler-wrap,.sp-wrap,.sp-head')

В этом случае ненужные элементы не будут находиться в коллекции.

Альтернативным решением может быть проверка родителя непосредственно в цикле.

Родительский элемент можно получить с помощью свойства parentNode.

Таким образом вызывать click нужно только есть у родителя нет класса center. Проверить это можно, вызвав метод contains у свойства classList

spoilers.forEach(function (node) {
  if(node.parentNode.classList.contains('center')) return;
  node.querySelector('.clickable').dispatchEvent(new Event('click'));
});
READ ALSO
Как получить ассоциативный массив jquery?

Как получить ассоциативный массив jquery?

Нужна помощь с jsЕсть таблица, по нажатию кнопки все элементы строки попадают в массив

201
TrezorConnect и web3.eth.sendRawTransaction

TrezorConnect и web3.eth.sendRawTransaction

Реализую транзакцию с подписью трезораНо получаю ошибку о том, что недостаточно средств, хотя на обоих кошельках есть ethereum

112
Центровка карты по местоположению

Центровка карты по местоположению

Необходимо определить координаты местоположения и отобразить карту согласно определенному местоположениюЕсли местоположение определить...

189
Tab контрол с эффектом collapse работает не правильно

Tab контрол с эффектом collapse работает не правильно

Нужно сделать tab-control , чтобы вкладки открывались с эффектом slideDownВ начале все формы скрыты , нажимаем кнопку "Форма 1", открывается блок с эффектом...

117