div與table的區別
1:速度和載入方式方面的區別
div
和table 的差異不是速度,而是載入方式,速度只能是指網路速度,如果速度足夠快,是沒有差異的:
div
的載入方式是即讀即載入,遇到沒有遇到
的時候一樣載入div 中的內容,讀多少載入多少;table 的載入方式是完成後載入,遇到後,在讀到
之前,table 中的內容不載入,或者傳輸中斷了(document.onload()事件)的時候載入,這是因為table牽涉到多行多列問題,所以只有當table所有內容載入完畢,ie才知道該怎麼顯示
2:在網頁應用中的差別
如果頁面首尾加table ,那麼必須等整個頁面讀完了才載入
如果頁面首尾加div ,無任何影響
3:div
與table
布局在大型**的可用性比較
div
與table本身並不存在什麼優缺點,所謂web標準只是推薦的是正確的使用標籤,好比說:div用於布局,而table則本來就是轉二維資料的。讓table做該做的事,並不是說頁面裡不出現table就是多麼多麼牛。
用div進行排版的優勢就是我不說,大家應該都比較清楚。div是標準,是大勢所趨,但並不意味著所有的頁面都適合用它來做。
為什麼div不適合他們?下面我從幾個方面來逐一說明:
精簡**:
大家都說div的布局精簡**,但是用div替代table所節約的**又被css(樣式)所占用,而這些樣式大多用於控制div的排版布局。那你會說了,css可以放在外部重用啊,要想得到這個問題的答案請往下看。
通訊:統一的樣式表檔案採用外部呼叫的形式,這樣每次載入單個頁面都會多一次對伺服器的http請求伺服器都會增加一次響應,這樣對前端web伺服器 會是很大的消耗。而原來很長時間都是將css和js寫在頁面前端(大家可以看看sohu和sina的頁面,大多都是採用這樣的形式),而不是作為外部呼叫 的形式,也是為了盡量避免給伺服器增加消耗。
頁面快取:
相容性:
對於css(樣式表)並不是所有瀏覽器的所有版本都支援的很好,比如ie5以前的瀏覽器對於css的支援就不是很好。而現在使用ie5以前版本 瀏覽器的使用者不在少數,這樣就使得在頁面製作的過程中需要針對不同瀏覽器版本進行測試,以保證相容性,無形中也增加很多任務作量(至少我接觸的開發人員製作div頁面比table頁面的標準時間要長一些)。
橫切與延展性:
橫切——
以上我們只是討論某一技術在某一領域的可用性,而非技術本身。
說了這麼多並不是說div這種布局方式不好,而是說我們應該正確的看待table在以內容為基礎的大型門戶中的作用,而不是人云亦云。之所以div的布局方式沒有在大型**應用,不是說門戶沒有用div是技術落後,是裡面的人沒有前瞻性,而是多種原因決定的。網易之所以全部採用div的方式是因為內容並不是他們主攻方向。而對於其他門戶來說,這樣的決策是要靠時間來驗證的。只是現在這個時機還不成熟而已。
4:div+css
而現在我認為div +css並不是字面上的含義那麼簡單,而有兩重內在含義:
1、結構與表現分離,用div完成結構,用css控制表現,這樣帶來的好處非常多,div精簡了頁面,提高了靈活性。而精通css的設計師能避免div的重複巢狀,從而大大提高頁面載入速度,以及站點的可以維護性。
2、選用div 來配合css的原因,css 的核心是
「盒子模型
」,而沒有哪個標籤能比div更好的詮釋
「盒子模型
」的精髓,table的結構過於複雜,並不能很好的做到這一點,雖然table+css也是一種選擇,但別忘了div還有另外乙個優勢,浮動層疊,而且用table進行布局的**是不能通過w3c驗證的。
在我親身經驗中,使用div+css的團隊,與使用table+css的團隊相比,工期縮短30%-50%。
Div 與 table 的區別
1 速度和載入方式方面的區別 div 和 table 的差異不是速度,而是載入方式,速度只能是指網路速度,如果速度足夠快,是沒有差異的 div 的載入方式是即讀即載入,遇到 沒有遇到 的時候一樣載入 div 中的內容,讀多少載入多少 table 的載入方式是完成後載入,遇到 後,在讀到 之前,tab...
Div 與 table 的區別
一.速度和載入方式方面的區別 div 和 table 的差異不是速度,而是載入方式,速度只能是指網路速度,如果速度足夠快,是沒有差異的 div 的載入方式是即讀即載入,遇到 沒有遇到 的時候一樣載入 div 中的內容,讀多少載入多少 table 的載入方式是完成後載入,遇到 後,在讀到 之前,tab...
Div與table的區別
1 速度和載入方式方面的區別 div 和 table 的差異不是速度,而是載入方式,速度只能是指網路速度,如果速度足夠快,是沒有差異的 div 的載入方式是即讀即載入,遇到 沒有遇到 的時候一樣載入 div 中的內容,讀多少載入多少 table 的載入方式是完成後載入,遇到 後,在讀到 之前,tab...