技術(shù)頻道導(dǎo)航
HTML/CSS
.NET技術(shù)
IIS技術(shù)
PHP技術(shù)
Js/JQuery
Photoshop
Fireworks
服務(wù)器技術(shù)
操作系統(tǒng)
網(wǎng)站運(yùn)營

贊助商

分類目錄

贊助商

最新文章

搜索

Firefox開發(fā)者:document.write()使用不當(dāng)導(dǎo)致網(wǎng)頁解析錯(cuò)誤

作者:admin    時(shí)間:2013-10-21 11:19:31    瀏覽:

我們?cè)诰帉慼tml代碼時(shí),有時(shí)會(huì)通過js來操作html,document.write()的使用率還是挺高的。不過,通過今天的發(fā)現(xiàn),看了Firefox開發(fā)者的一篇文章之后,了解到原來document.write()是不可以隨便寫,在使用document.write()時(shí)需要注意一些事項(xiàng),否則會(huì)引起解析器對(duì)標(biāo)簽的錯(cuò)誤解析,從而延長(zhǎng)網(wǎng)頁的加載時(shí)間。

document.write() 寫入不平衡 造成解析錯(cuò)誤

今天在用firefox控制臺(tái)調(diào)試網(wǎng)頁時(shí),發(fā)現(xiàn)兩條js的錯(cuò)誤,顯示如下:

[11:33:46.227] 利用 document.write() 寫入不平衡樹引發(fā)來自網(wǎng)絡(luò)的數(shù)據(jù)被重新解析。更多信息參見 https://developer.mozilla.org/en/Optimizing_Your_Pages_for_Speculative_Parsing @ http://www.howtostagehomes.com/:174

[11:33:52.295] 利用 document.write() 寫入不平衡樹引發(fā)來自網(wǎng)絡(luò)的數(shù)據(jù)被重新解析。更多信息參見 https://developer.mozilla.org/en/Optimizing_Your_Pages_for_Speculative_Parsing @ http://www.howtostagehomes.com/:1228

根據(jù)提示,我找到對(duì)應(yīng)的js代碼:

第一條是這樣寫的

<table>
<script language=javascript >
  document.write ("<tr><td>文章列表一</td></tr>");
  document.write ("<tr><td>文章列表二</td></tr>");
</script>
</table>

第二條是這樣寫的

document.write("文章列表一");

firefox認(rèn)為我這樣的document.write() 寫入不平衡,從而造成推斷解析錯(cuò)誤。

下面看看Firefox開發(fā)者是怎樣說的。

優(yōu)化你的網(wǎng)頁推測(cè)解析

傳統(tǒng)的瀏覽器中,HTML解析器在主線程上運(yùn)行,當(dāng)遇到</ SCRIPT>標(biāo)記時(shí)會(huì)被鎖定,直到腳本已經(jīng)執(zhí)行成功。HTML解析器在Firefox 4及更高版本支持推斷性的解析,它能提前解析正在下載的腳本并執(zhí)行它。Firefox 4及更高版本的HTML解析器也運(yùn)行HTML樹構(gòu)造算法推測(cè)。有利的一面是,當(dāng)一個(gè)推擋解析成功,就沒有必要重新分析已經(jīng)被掃描過的腳本、樣式表和圖像文件的傳入部分。缺點(diǎn)是,當(dāng)一個(gè)推測(cè)解析失敗時(shí),會(huì)有更多的工作丟失。

此文檔可以幫助你避免推測(cè)失敗,減緩你的頁面加載的那些東西。

使推測(cè)成功加載

只有一條規(guī)則使推測(cè)加載鏈接腳本、樣式表和圖標(biāo)成功:

● 如果使用<base>元素覆蓋你的網(wǎng)頁基本URI,把元素放到文檔的非腳本部分,不要通過document.write()或document.createElement()方法添加它。

避免失去樹構(gòu)建輸出

 當(dāng)document.write()改變樹結(jié)構(gòu)狀態(tài)時(shí),推測(cè)樹構(gòu)建就會(huì)失敗,以至當(dāng)所有內(nèi)容通過document.write()解析并插入后,推測(cè)狀態(tài)在</script>標(biāo)簽之后將不再保留。然而只有不正確使用document.write()才會(huì)遇到問題,我們可以避免它:

● 不要寫不平行的樹,

<script>document.write("<div>");</script>

是不對(duì)的,

<script>document.write("<div></div>");</script>

是正確的。

● 不要寫一個(gè)未完成的標(biāo)記,

<script>document.write("<div></div");</script>

是不對(duì)的。

● 不要使用回車來結(jié)束

<script>document.write("Hello World!\r");</script>

是不對(duì)的

<script>document.write("Hello World!\n");</script>

是正確的。

● 注意寫均衡的標(biāo)簽可能導(dǎo)致其他標(biāo)簽被推斷的方式,使寫不平衡。例如

<script>document.write("<div></div>");</script>

在head元素里將被解釋為

<script>document.write("</head><body><div></div>");</script>

這是不平行的。

● 不要格式化表的一部分

<table>
<script>document.write("<tr><td>Hello World!</td></tr>");</script>
</table>

是不對(duì)的。然而,

<script>document.write("<table><tr><td>Hello World!</td></tr></table>");</script>

是沒有問題的。

標(biāo)簽: document.write  
相關(guān)文章
    x
    • 站長(zhǎng)推薦
    /* 左側(cè)顯示文章內(nèi)容目錄 */