Задать вопрос
@1Nuuk

Делаю сайт, программа правильная, но выдает ошибку, в чем проблема?

const model = [
 {type: 'title', value: 'helloy world from js'},
 {type: 'text', value: 'here we go wi'},
 {type: 'columns', value: [
  '11111111',
  '22222222',
  '333333333',
 ]}
]

const $site = document.querySelector( '#sete' );

model.forEach(block => {
 let html = ''
 if (block.type === 'title') {
 html =`
  <div class="row">
   <div class="col-sm">
    <h1>${block.value}</h1>
   </div>
  </div>
 `
 }else if (block.type === 'text') {
 html = `
 <div class="row">
   <div class="col-sm">
    <p>$(block.value)</p>
   </div>
  </div>
 `
 }else if (block.type === 'columns') {

 }

 $site.insertAdjacentHTML('beforebegin', html); 

})


Ошибка такая;
index.js:35 Uncaught TypeError: Cannot read properties of null (reading 'insertAdjacentHTML')
    at index.js
    at Array.forEach (<anonymous>)
    at
  • Вопрос задан
  • 247 просмотров
Подписаться 1 Простой 4 комментария
Решения вопроса 1
MrDecoy
@MrDecoy Куратор тега JavaScript
Верставший фронтендер
переменная $site = null.
такое происходит когда querySelector не нашёл в разметке ничего подходящего.
Либо опечатка в селекторе, либо элемент, который вы через селектор ищите - подгружается диинамически и позже описанного кода, соответтсвенно, на момент его выполнения в разметке такого элемента нет.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
402d
@402d
начинал с бейсика на УКНЦ в 1988
Если "правильный" код работает "неправильно", то он вызывается в "неправильное время".
Вот для начала https://habr.com/ru/companies/yandex/articles/718084/

От себя скажу упрощенно.
Страница это обычно куча подключаемых файлов. Броузер дотягивает их в 5 потоков.
У вас может все нормально работать при первой загрузке страницы, а при возврате падать в ошибку.
Тут проявляется работа кеша. Код из выше подключенного скрипта успевал отработать пока грузился следующий.

И бонус. Синтаксическая ошибка в каком то левом месте может аукнуться не работой всего остального кода.
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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