2

let menu = document.getElementsByClassName('menu-item');
document.ul.insertBefore(menu[2], menu[1]);
console.log(menu[2]);
console.log(menu[1]);
<header>
  <nav>
    <ul class="menu">
      <li class="menu-item">Первый пункт</li>
      <li class="menu-item">Третий пункт</li>
      <li class="menu-item">Второй пункт</li>
      <li class="menu-item">Четвертый пункт</li>
    </ul>
  </nav>
</header>
<div class="column"></div>
<div class="column">
  <div class="title" id="title">
    Мы продаем только технику Apple
  </div>
  <div class="adv">
    Это назойливая реклама, которую нужно удалить
  </div>
  <div class="prompt" id="prompt">
  </div>
</div>

код ошибки:

script.js:2 Uncaught TypeError: Cannot read property 'insertBefore' of undefined

но при console.log получаю:

<li class="menu-item">Третий пункт</li>
<li class="menu-item">Второй пункт</li>
12
  • Сразу говорю учусь работать с javascript так что для профессионалов это мб очень легко ,в инете ответ не нашёл.
    – lustrep
    28 июл 2019 в 13:19
  • откуда ты взял document.ul?
    – Grundy
    28 июл 2019 в 13:22
  • я понимаю что тут ошибка но в чём мне надо просто заменить элемент
    – lustrep
    28 июл 2019 в 13:24
  • так и получи этот элемент. в твоему случае document.ul возвращает undefined, поэтому и был вопрос, почему ты решил, что это вернет что-то еще
    – Grundy
    28 июл 2019 в 13:25
  • да но почему я тогда получаю нужные мне элементы при console.log()?
    – lustrep
    28 июл 2019 в 13:27

1 ответ 1

3

Cannot read property '...' of undefined

Не удаётся прочитать свойство '...' из неопределённого

В представленном вами коде, даже не определен объект document.ul, но вас это не останавливает и вы пытаетесь обратиться к методу insertBefore неопределенного (undefined) объекта.


const menu = document.getElementsByClassName('menu-item');

menu[0].parentNode.insertBefore(menu[2], menu[1]);
<ul class="menu">
  <li class="menu-item">Первый пункт</li>
  <li class="menu-item">Третий пункт</li>
  <li class="menu-item">Второй пункт</li>
  <li class="menu-item">Четвертый пункт</li>
</ul>


Добавляем элемент menu[2] в список дочерних к родителю menu[0].parentNode после элемента menu[1] при помощи insertBefore:

menu[0].parentNode.insertBefore(menu[2], menu[1]);

Если такой элемент уже существует, то просто сменится его позиция в DOM дереве.

2
  • 1
    заработало но можете объяснить эту строчку menu[0].parentNode.insertBefore(menu[2], menu[1]);(что значит parentNode и почему сначала идёт menu[0])
    – lustrep
    28 июл 2019 в 14:00
  • а почему ответ сделал общим?
    – Grundy
    28 июл 2019 в 22:00

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.