eprivalov
@eprivalov
Учусь

Uncaught TypeError: Cannot read property 'setAttribute' of null. Как победить?

В коде происходит ошибка Uncaught TypeError: Cannot read property 'setAttribute' of null не могу понять почему. Помогите, пожалуйста, найти решение.

/*
  * Sub menu "More" for main menu
  * */
  var main_menu = document.querySelector('.layout_core_menu_main .navigation');
  if(document.querySelector('.layout_core_menu_main .navigation')){
    var main_menu_items = main_menu.querySelectorAll('li');
    var l = main_menu_items.length;
    var maxCountShow = 7;
    if(l > maxCountShow) {
      var subMenu = document.createElement('ul');
      for(var i = maxCountShow; i < l; i ++) {
        var item = main_menu_items[i];
        subMenu.appendChild(item);
      }
      var more = item.cloneNode(true);
      var more_a = more.querySelector('a');
      more_a.setAttribute('href', 'javascript://'); // В этой строчке ошибка
      more_a.setAttribute('class', 'menu_core_main core_main_more');
      more_a.innerHTML = 'More <i class="hei hei-angle-down hei-lg"></i>';
      more.appendChild(subMenu);
      main_menu.appendChild(more);
    }
  }
  • Вопрос задан
  • 2082 просмотра
Пригласить эксперта
Ответы на вопрос 1
GM2mars
@GM2mars
Без HTML тут сходу и не разобраться что нужно, но ясно одно, код нужно переписывать, слишком много ненужных манипуляций.

Update:
На сколько я понял, у вас есть меню с элементами. Если элементов больше maxCountShow, то мы их скрываем и показываем кнопку "Показать больше".
Я бы сделал через css скрытие (такую задачу по моему можно всю сделать через css):
https://jsfiddle.net/xj8s68ws/1/
CSS
.fold {
    display: none;
}

HTML
<ul class="main-menu">
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
    <li>item 4</li>
    <li>item 5</li>
    <li>item 6</li>
    <li>item 7</li>
    <li>item 8</li>
    <li>item 9</li>
    <li>item 10</li>
</ul>

JavaScript
function Folding() {
    var maxShowCount=7,
        main_menu=document.querySelector('.main-menu'),
        items= (main_menu) ? main_menu.querySelectorAll('li') : false,
        i,
        show_more,
        fold=0;
    
    if (!items) return;
    
    for (i in items) {
        if (i >= maxShowCount) {
            items[i].className='fold';
            fold++;
        }
    }
    if (fold) {
        show_more=document.createElement('a');
        show_more.appendChild(document.createTextNode('Показать больше'));
        main_menu.appendChild(show_more);
        show_more.addEventListener("click", show_all);
    }
    
    function show_all(e) {
        var fold_items=main_menu.querySelectorAll('.fold'),
            a;
        
        show_more.removeEventListener("click", show_all);
        e.target.remove();
        for (a in fold_items) {
            fold_items[a].className='';
        }
    };
}
Folding();
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы