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 that you have read and understand our privacy policy and code of conduct.

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