Почему крашится скрипт элементов с id, которые на разных страницах?

Question

[powercoder]

Есть целостный скрипт, его я прилагаю. Он делает так, чтобы при нажатии на чекбокс появлялся/скрывался определенный блок с контентом. В скрипте чекбокс связан с блоком контента через обоюдный id, связь которых прописана в const.

На одной странице находятся:

link01: 'tab1',
  link02: 'tab2',
  link03: 'tab3',
  link04: 'tab4',
  link05: 'tab5',
  link06: 'tab6',
  link07: 'tab7',
  link08: 'tab8',
  link09: 'tab9',

На другой странице:

link010: 'tab10',
  link011: 'tab11',
  link012: 'tab12',
  link013: 'tab13',
  link014: 'tab14',
  link015: 'tab15',
  link016: 'tab16',

На первой странице все работает, на второй же скрипт функционирует, если я из него удалю

link01: 'tab1',
  link02: 'tab2',
  link03: 'tab3',
  link04: 'tab4',
  link05: 'tab5',
  link06: 'tab6',
  link07: 'tab7',
  link08: 'tab8',
  link09: 'tab9',

Как исправить, помогите, коллеги. Заранее благодарю!

ЦЕЛЫЙ СКРИПТ:

const checkbox2tabMap = {
  link01: 'tab1',
  link02: 'tab2',
  link03: 'tab3',
  link04: 'tab4',
  link05: 'tab5',
  link06: 'tab6',
  link07: 'tab7',
  link08: 'tab8',
  link09: 'tab9',
  link010: 'tab10',
  link011: 'tab11',
  link012: 'tab12',
  link013: 'tab13',
  link014: 'tab14',
  link015: 'tab15',
  link016: 'tab16',
};
function onCheckboxChange(event) {
  const tab = document.getElementById(checkbox2tabMap[event.target.id]);
  if(!tab) { return; }
  tab.style.display = event.target.checked ? 'block' : 'none';
}
Object.keys(checkbox2tabMap).forEach(
  id => document.getElementById(id).addEventListener('change', onCheckboxChange)
);

Comments

[Пашенька]

.forEach > .addEventListener - это жёсска. Ну, наверняка в консоли есть все ответы. Что консоль то говорит?

[powercoder]

like-a-boss, уже разобрался,необходимо было повесить проверку на undefined перед addEventListener

Answer 1

[powercoder]

В коде нужно заменить отрывок на:

Object.keys(checkbox2tabMap).forEach((id) =>{
    let check = document.getElementById(id);
    if(check) check.addEventListener('change', onCheckboxChange)
});