2013-08-27 4 views
3

У меня есть этот метод, который работает отлично, за исключением Firefox:Javascript, Firefox заменить весь документ без document.write

function write(template) { 
    document.open("text/html", "replace"); 
    document.write(template); 
    document.close(); 
} 

write("<!DOCTYPE html><head><title>MyPage</title></head><body>111</body><html>"); 

В светлячок всей странице больше не может обновляться и при обновлении хэша в поле адреса создает полное обновление страницы.

Это не происходит в хроме.

Есть ли другой способ обновить весь документ, который заставляет Firefox играть вместе?

Спасибо!

----------- ---------- РЕДАКТИРОВАТЬ

я заметил, есть document.childNodes [0] .remove() метод для вызова которого удаляется старый документ, но я не могу добавить новый узел документа в этот массив.

var node = document.createElement("html"); 
node.innerHTML = "<body>1111</body>"; 
document.childNodes[0].remove(); 
document.childNodes[0] = node; 

Кажется, что не работает. Любые намеки?

----------- EDIT 2 ----------

function write(template) { 
    var node = document.createElement("html"); 
    node.innerHTML = template; 

    var head = node.getElementsByTagName("head")[0]; 
    var body = node.getElementsByTagName("body")[0]; 

    if (head) { 
     document.documentElement.replaceChild(
      head, 
      document.documentElement.getElementsByTagName("head")[0] 
     ); 
    } 

    if (body) { 
     document.documentElement.replaceChild(
      body, 
      document.documentElement.getElementsByTagName("body")[0] 
     ); 
    } 

} 

Это успешно делает замену РОМ, к сожалению, в отличие написать Безразлично» т переоценивать теги стилей или скриптов, что делает его бесполезным :(

------- РЕДАКТИРОВАНИЕ 3 -------

Вырабатывает же, как EDIT 2, что делает его тоже бесполезно:

function write(template) { 
    var node = document.createElement("html"); 
    node.innerHTML = template; 

    document.replaceChild(node, document.childNodes[0]); 

} 

----- EDIT 4 -----

Смотрите мой ответ ниже

+0

'document.open()' не имеет параметров: http://www.w3.org/TR/DOM-Level-2-HTML/html.html # ID-72161170 – Raptor

+0

Что еще более важно, сам браузер, похоже, не поддерживает параметры: https://developer.mozilla.org/en-US/docs/Web/API/document.open – Zhihao

+0

Он ведет себя по-разному, фактически, без второго параметра. Если замены нет, после записи вы сможете вернуться в историю с помощью кнопки «Назад» в браузере. Если да, то вы не можете. – momomo

ответ

1

Видимо, JQuery умеет переоценивать сценарии, когда HTML() правильно используется, здесь метод записи:

function write(template) { 
    var node  = document.createElement("html"); 
    node.innerHTML = template; 

    var head = node.getElementsByTagName("head")[0]; 
    var body = node.getElementsByTagName("body")[0]; 

    if (head) { 
     jQuery("head").html(head.innerHTML); 
    } 

    if (body) { 
     jQuery("body").html(body.innerHTML); 
    } 

} 

write("<!DOCTYPE html><head><title>MyPage</title></head><body>111</body><html>"); 

: D

1

Я бы порекомендовал вам использовать в .html() функции JQuery. (или innerHTML, если вы предпочитаете использовать чистый Javascript)

Если документ DOM уже загружен, вы не должны использовать document.write.

+2

это не отвечает на вопрос OP ... – Raptor

+0

Заголовок вопроса: «Firefox заменяет весь документ без document.write' – Alvaro

+0

Я согласен, что функция html() не делает то, что мне нужно. Я хочу заменить весь документ, включая голову, заголовок, а что нет. Он отлично работает в других браузерах (не тестировал IE) – momomo

0

После замены DOM, вы можете вручную revalute script сек и style s, создавая новые элементы:

function write(template) { 
    var node = document.createElement("html"); 
    node.innerHTML = template; 

    var head = node.getElementsByTagName("head")[0]; 
    var body = node.getElementsByTagName("body")[0]; 

    if (head) { 
     document.documentElement.replaceChild(
     head, 
      document.documentElement.getElementsByTagName("head")[0] 
    ); 
    } 

    if (body) { 
     document.documentElement.replaceChild(
     body, 
     document.documentElement.getElementsByTagName("body")[0] 
    ); 
    } 


var scripts = document.getElementsByTagName("script"), 
styles = document.getElementsByTagName("style"); 

var or_scripts_length = scripts.length, 
or_styles_length = styles.length; 

//reproduce scripts 
for(var i=0; i<or_scripts_length; i++){ 
    new_script = document.createElement("script"); 
    new_script.setAttribute("src", scripts[i].src); 
    document.head.appendChild(new_script); 
    if(i == or_scripts_length) 
    break; //in order to avoid revaluating new created scripts which results to an infinite loop 
} 

//do the same for styles 
} 
Смежные вопросы