Почему вылезает ошибка doc.head is null при полной замене html страницы?

Question

[lolrofl01]

Добрый день.
Стоит задача заменить весь html код страницы на новый, который приходит через ajax. Грубо говоря загрузка страниц без перезагрузки. Нажимаешь определенные ссылки - уходит get запрос на сервер, в ответ приходит полный html нужной страницы (начиная с !DOCTYPE). Меняю благодаря незабвенному jquery:
$('html').html(result.code);
И вроде бы все работает так, как надо, проблем нет никаких, однако в консоле после каждой такой смены вылезает ошибка, которая вроде бы ни на что не влияет, но неприятно:

Uncaught TypeError: can't access property "appendChild", doc.head is null

Чтобы это значило? Может после смены html надо какой-то триггер вызвать или заменять как-то не так?

Comments

[Владислав Лысков]

ты не можешь изменять html как дом элемент

[lolrofl01]

Владислав Лысков, а как его изменять? В интернетах пишут про второй способ:

var newHTML = document.open("text/html", "replace"); 
            newHTML.write(Str); 
            newHTML.close();

Все работает, но только в первый раз, а дальше скрипты все слетают и страницы перезагружается. Я так понимаю, потому что фактически новый документ был создан, а обработчики висят на старом...

[Владислав Лысков]

lolrofl01, на самом деле какая-то странная задача

[lolrofl01]

Владислав Лысков, вполне стандартная задача. Можно. конечно, натянуть vue, поставить ноду, установить кучу плагинов, чтобы получился ssr. Можно пойти проще - установить инерцию или livewire. Но когда проект - кривой МВП и состоит из целых 6 страниц - какой в этом смысл?! Поэтому упрощаем еще сильнее - либо делаем на сервере рендер body части и вставляем ее, соответственно, в $('body'), но тут встают вопросы того, что надо отдельно будет менять тайтл, дескрипшн, разные теги и на некоторых страницах подгружать дополнительные файлы со стилями и\или скриптами. Это все реализуемо, но еще куда проще ничего этого не делать - отправлять get запрос и получать уже готовый html страницы и просто вставлять его вместо текущего. Задача на 5 минут. И вроде все работает так, как надо. Но ошибка смущает, мало ли к чему она приведет в будущем.

Задача из разряда "инвестор хочет бегло глянуть будет ли лучше, ведь это современно". По опыту знаю, что ему понравится и он решит оставить эту реализацию 100%, поэтому переживаю за ошибку, вдруг завтра будет задача, которую нельзя будет реализовать из-за этой ошибки. Или она не влияет ни на что?

[Владислав Лысков]

lolrofl01,

в ответ приходит полный html нужной страницы (начиная с !DOCTYPE).

[Aetae]

Если ты обновляешь всю страницу - просто переходи на новую страницу, лол. Разница будет лишь в том что обновиться url и браузер куда лучше сумеет обработать перерисовку.:)

А так - напротив ошибки указывается место в коде которое её вызвало, тыкаешь и смотришь кто там пытается обратиться к head которого пока нет.

[lolrofl01]

Владислав Лысков, и?

[lolrofl01]

Aetae,

Разница будет лишь в том что обновиться url и браузер куда лучше сумеет обработать перерисовку.:)

Ну это хотелки инвестора. Сайт итак быстро грузится, практически без перезагрузок, круглешок загрузки виден на 0.5сек при переходе и вот он инвестора напрягает. Но из-за этого делать грамотное разделение фронта с бэком и рестом между ними я не хочу, мне банально жаль времени. Поэтому приходится выбирать максимально быстрое решение.

А так - напротив ошибки указывается место в коде которое её вызвало, тыкаешь и смотришь кто там пытается обратиться к head которого пока нет.

Да ладно)))

Вот как раз этот скрипт и вызывает ошибку, именно та строка, которая заменяет $('html').html(result.code).

Answer 1

[Анастасия Foxman]

Попробуйте удалить старый "head" с содержимым

$('head').remove();
$('html').html(result.code);