|
|
|
|
|
|
贊助商
分類目錄
贊助商
最新文章
搜索
Firefox開發(fā)者:document.write()使用不當導致網頁解析錯誤
作者:admin 時間:2013-10-21 11:19:31 瀏覽:我們在編寫html代碼時，有時會通過js來操作html，document.write()的使用率還是挺高的。不過，通過今天的發(fā)現，看了Firefox開發(fā)者的一篇文章之后，了解到原來document.write()是不可以隨便寫，在使用document.write()時需要注意一些事項，否則會引起解析器對標簽的錯誤解析，從而延長網頁的加載時間。
document.write() 寫入不平衡 造成解析錯誤
今天在用firefox控制臺調試網頁時，發(fā)現兩條js的錯誤，顯示如下：
[11:33:46.227] 利用 document.write() 寫入不平衡樹引發(fā)來自網絡的數據被重新解析。更多信息參見 https://developer.mozilla.org/en/Optimizing_Your_Pages_for_Speculative_Parsing @ http://m.howtostagehomes.com/:174
[11:33:52.295] 利用 document.write() 寫入不平衡樹引發(fā)來自網絡的數據被重新解析。更多信息參見 https://developer.mozilla.org/en/Optimizing_Your_Pages_for_Speculative_Parsing @ http://m.howtostagehomes.com/:1228
根據提示，我找到對應的js代碼：
第一條是這樣寫的
<table>
<script language=javascript >
document.write ("<tr><td>文章列表一</td></tr>");
document.write ("<tr><td>文章列表二</td></tr>");
</script>
</table>
第二條是這樣寫的
document.write("文章列表一");
firefox認為我這樣的document.write() 寫入不平衡，從而造成推斷解析錯誤。
下面看看Firefox開發(fā)者是怎樣說的。
優(yōu)化你的網頁推測解析
傳統(tǒng)的瀏覽器中，HTML解析器在主線程上運行，當遇到</ SCRIPT>標記時會被鎖定，直到腳本已經執(zhí)行成功。HTML解析器在Firefox 4及更高版本支持推斷性的解析，它能提前解析正在下載的腳本并執(zhí)行它。Firefox 4及更高版本的HTML解析器也運行HTML樹構造算法推測。有利的一面是，當一個推擋解析成功，就沒有必要重新分析已經被掃描過的腳本、樣式表和圖像文件的傳入部分。缺點是，當一個推測解析失敗時，會有更多的工作丟失。
此文檔可以幫助你避免推測失敗，減緩你的頁面加載的那些東西。
使推測成功加載
只有一條規(guī)則使推測加載鏈接腳本、樣式表和圖標成功：
● 如果使用<base>元素覆蓋你的網頁基本URI，把元素放到文檔的非腳本部分，不要通過document.write()或document.createElement()方法添加它。
避免失去樹構建輸出
當document.write()改變樹結構狀態(tài)時，推測樹構建就會失敗，以至當所有內容通過document.write()解析并插入后，推測狀態(tài)在</script>標簽之后將不再保留。然而只有不正確使用document.write()才會遇到問題，我們可以避免它：
● 不要寫不平行的樹，
<script>document.write("<div>");</script>
是不對的，
<script>document.write("<div></div>");</script>
是正確的。
● 不要寫一個未完成的標記，
<script>document.write("<div></div");</script>
是不對的。
● 不要使用回車來結束
<script>document.write("Hello World!\r");</script>
是不對的
<script>document.write("Hello World!\n");</script>
是正確的。
● 注意寫均衡的標簽可能導致其他標簽被推斷的方式，使寫不平衡。例如
<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>
是不對的。然而，
<script>document.write("<table><tr><td>Hello World!</td></tr></table>");</script>
是沒有問題的。
標簽: document.write
