28еместо
Реформал.Ру « все идеи проекта

81

-9
+90

Использование document.write в виджете - плохая идея

На текущий момент использую скрипт виджета tabn2v4.js
В нем используется document.write что несет кучу проблем и ограничений:
1. В XHTML document.write как такового быть не должно - http://www.w3.org/MarkUp/2004/xhtml-faq#docwrite
2. Асинхронная загрузка скрипта виджета невозможна, поскольку, после полной загрузки DOM скрипт виджета просто подменяет страницу собой (собственно см. п.1).
3. При наличии манипуляций с DOM на странице, куда вставлен скрипт виджета, до полной загрузки скрипта весь функционал, соответственно, не работает :( Это касается функционала на JQuery/ExtJS/Prototype etc..
4. В общем использование document.write является крайне плохой практикой, ввиду количества проблем с ним.

Вместо document.write рекомендую использовать или document.body.appendChild, или .innerHTML.

FieryFenix, 22.03.2011, 20:21
Помечено как спам Дубликат?
Статус идеи: ожидает рассмотрения

Комментарии

Влад Рафеев, 20.10.2011, 12:58
Из-за этой проблемы не получается загрузить виджет через библиотеку HeadJS. А это очень важно для любого крупного проекта. Почему?

Представим, что на вашем сайте висят:
— счетчик Google Analytics
— Яндекс.Метрика
— jQuery
— яваскрипт вашего проекта
— ещё какие-то внешние скрипты, о которых вы уже не помните

Загрузка каждого из этих скриптов откладывает рендеринг страницы на время загрузки и выполнения. Поэтому пользователям сайта начинает казаться, что сайт «тупит», хотя на самом деле тупят внешние скрипты.
Влад Рафеев, 20.10.2011, 13:02
страница с сайта Google на эту тему
http://code.google.com/speed/page-speed/docs/payload.html#DeferLoadingJS
EnakinSkywalker, 14.11.2013, 20:04
Перед вызовом сторонних скриптов подменяйте код document.write. Это избавит от этой проблемы. например я делал так (Mootools):

document.write = function (html) {
var el = $('document_write');
el.set('html', el.get('html') + html);
};
EnakinSkywalker, 15.11.2013, 10:26
Не совсем полный код привел. Вот более полный:

document.old_write = document.write;
var add_area = document.createElement('div');
add_area.setAttribute('id', 'document_write');
var x = document.getElementsByTagName('body')[0];
x.appendChild(add_area);

document.write = function (html) {
var el = $('document_write');
el.set('html', el.get('html') + html);
};

Оставить комментарий