Скрыть кнопки JS

207
01 апреля 2018, 22:13

Есть кнопки такого вида:

<button value="мужская" data-option="Мужская одежда" class="control">Мужская одежда</button>
<button value="женская" data-option="Женская одежда" class="control">Женская одежда</button>
<button value="разное" data-option="Разное" class="control">Разное</button>

И массив: Array['Разное', 'Женская одежда']
Как при помощи JS скрыть кнопку, если значение data-option нет в списке?

Answer 1

Если я правильно все понял, то один из вариантов:

$(document).ready(function(){ 
  var arr = ['Разное','Женская одежда']; 
  $('button').each(function(){ 
      var data = $(this).attr('data-option'); 
      if (arr.indexOf(data) == -1) { 
      	$(this).hide(); 
      } 
  }); 
 } 
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<button value="мужская" data-option="Мужская одежда" class="control">Мужская одежда</button> 
<button value="женская" data-option="Женская одежда" class="control">Женская одежда</button> 
<button value="разное" data-option="Разное" class="control">Разное</button>

Answer 2

window.addEventListener('load', () => { 
  /** 
   * @type {NodeListOF<HTMLElement>} 
   */ 
  let buttonList = document.getElementsByClassName('control') 
 
  /** 
   * @type {HTMLElement} 
   */ 
  let button = null 
  let arr = ['Разное', 'Женская одежда'] 
 
  for ( 
    button of buttonList 
  ) { 
    // let include = arr.includes(button.dataset.option) 
    let include = -1 !== arr.indexOf(button.dataset.option) 
    if (!include) { 
      button.hidden = true 
    } 
  } 
})
<button value="мужская" data-option="Мужская одежда" class="control">Мужская одежда</button> 
<button value="женская" data-option="Женская одежда" class="control">Женская одежда</button> 
<button value="разное" data-option="Разное" class="control">Разное</button>

READ ALSO
Получить значение функции

Получить значение функции

Можно ли получить значение функции first из функции calc? Я знаю как идет вызов функций, но без понятия как получить значение ещё не выполненной...

202
Вывести последние семь дней календаря

Вывести последние семь дней календаря

Хочу сделать диаграмму активности пользователя за прошедшие 7 дней календаряНикак не могу сообразить как это сделать

185
как работает функция compose() в javaScript?

как работает функция compose() в javaScript?

Допустим есть фрагмент когда

238
Оптимизация одной команды

Оптимизация одной команды

Знаю, код так себеКак его оптмизировать? Это моя самая долго обрабатываемая команда

305