.проверено с помощью javascript, чтобы не изменять входное радио html

#javascript #radio-group #checked #setattribute

Вопрос:

У меня есть набор радиовходов.

Я пытаюсь изменить ввод, который нужно проверить , когда я использую .checked = true , журнал консоли показывает, что это правда.

Но радио не показывает, проверено ли оно. С другой стороны, если я использую .setAttribute('checked', 'checked') , то он отображается проверенным и .getAttribute('checked') проверяется, но я не могу выполнить следующие команды.

 function galleryOut() {

  const backgroundChange = () => {
    landingBackground.classList.remove('opaque-bg');
    landingPage.classList.remove('blur-bg');

    console.log('gallery slides out');

    galleryRadioMenu.classList.remove('active');
    galleryClose.classList.remove('active');

    pictureSlideBox.classList.remove('active');

    console.log('sliding menu out');
  };
  const zIndexChange = () => {
    galleryPage.style.zIndex = '-5';

    console.log('removing z-index');
  };
  const firstRadioChange = () => {
    pictureSlideBox.style.transform = null;

    allRadio.forEach(radio => radio.setAttribute('checked', ''));
    firstRadio.setAttribute('checked', 'checked');
  };

  if (firstRadio.getAttribute('checked') === 'checked') {

    backgroundChange();

    setTimeout(zIndexChange, 3000);

  } else if (firstRadio.getAttribute('checked') === null) {

    firstRadioChange();

    setTimeout(backgroundChange, 3000);
    setTimeout(zIndexChange, 5000);
  }
} 
 <div class="gallery-radio">
  <form id="menu" class="align-left slide-in">
    <input class="radio-button" type="radio" id="slide1" name="slider" title="pic1" data-key="1" checked>
    <input class="radio-button" type="radio" id="slide2" name="slider" title="pic2" data-key="2">
    <input class="radio-button" type="radio" id="slide3" name="slider" title="pic3" data-key="3">
    <input class="radio-button" type="radio" id="slide4" name="slider" title="pic4" data-key="4">
    <input class="radio-button" type="radio" id="slide5" name="slider" title="pic5" data-key="5">
  </form>
</div> 

Я что-то здесь упускаю? В чем разница между .checked и .setAttribute («проверено», «проверено»)?

Комментарии:

1. вы пробовали firstRadio.checked = true ?

2. Чтение и изменение checked состояния элемента управления радио/флажком должно выполняться с помощью checked свойства этого элемента управления, а не путем чтения атрибута связанного HTML-элемента checked , потому что, хотя атрибут мог быть изначально установлен, элемент управления тем временем мог быть снят.

3. Кстати, в предоставленном скрипте есть несколько синтаксических ошибок, и уже из-за этого он терпит неудачу. И что еще более важно, когда galleryOut предполагается казнь?