前端面試題及答案
1、html5有哪些新特性、移除了那些元素?如何處理HTML5新標(biāo)簽的瀏覽器兼容問(wèn)題?如何區(qū)分 HTML 和HTML5?
(1)HTML5 現(xiàn)在已經(jīng)不是 SGML 的子集，主要是關(guān)于圖像，位置，存儲(chǔ)，多任務(wù)等功能的增加。
(2)用于媒介回放的 video 和 audio 元素
(3)本地離線存儲(chǔ) localStorage 長(zhǎng)期存儲(chǔ)數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失
(4)語(yǔ)意化更好的內(nèi)容元素，比如 article、footer、header、nav、section
(5)新的技術(shù)webworker, websockt, Geolocation移除的元素
(6)對(duì)可用性產(chǎn)生負(fù)面影響的元素：frame，frameset，noframes;支持HTML5新標(biāo)簽
(7)IE8/IE7/IE6支持通過(guò)document.createElement方法產(chǎn)生的標(biāo)簽
(8)瀏覽器支持新標(biāo)簽后，還需要添加標(biāo)簽?zāi)J(rèn)的樣式
2、CSS隱藏元素的幾種方法
(1)Opacity:元素本身依然占據(jù)它自己的位置并對(duì)網(wǎng)頁(yè)的.布局起作用。它也將響應(yīng)用戶交互;
(2)Visibility:與 opacity 唯一不同的是它不會(huì)響應(yīng)任何用戶交互。此外，元素在讀屏軟件中也會(huì)被隱藏;
(3)Display:display 設(shè)為 none 任何對(duì)該元素直接打用戶交互操作都不可能生效。此外，讀屏軟件也不會(huì)讀到元素的內(nèi)容。這種方式產(chǎn)生的效果就像元素完全不存在;
(4)Position:不會(huì)影響布局，能讓元素保持可以操作;
(5)Clip-path:clip-path 屬性還沒(méi)有在 IE 或者 Edge 下被完全支持。如果要在你的 clip-path 中使用外部的 SVG 文件，瀏覽器支持度還要低。
3、頁(yè)面導(dǎo)入樣式時(shí)，使用link和@import有什么區(qū)別?
(1)link屬于XHTML標(biāo)簽，除了加載CSS外，還能用于定義RSS, 定義rel連接屬性等作用;而@import是CSS提供的，只能用于加載CSS;
(2)頁(yè)面被加載的時(shí)，link會(huì)同時(shí)被加載，而@import引用的CSS會(huì)等到頁(yè)面被加載完再加載;
(3)import是CSS2.1 提出的，只在IE5以上才能被識(shí)別，而link是XHTML標(biāo)簽，無(wú)兼容問(wèn)題。
4、性能優(yōu)化的方法
(1) 減少http請(qǐng)求次數(shù)：CSS Sprites, JS、CSS源碼壓縮、圖片大小控制合適;網(wǎng)頁(yè)Gzip，CDN托管，data緩存 ，圖片服務(wù)器;
(2) 用innerHTML代替DOM操作，減少DOM操作次數(shù)，優(yōu)化javascript性能。
(3) 避免使用CSS Expression(css表達(dá)式)又稱Dynamic properties(動(dòng)態(tài)屬性)。
(4) 當(dāng)需要設(shè)置的樣式很多時(shí)設(shè)置className而不是直接操作style。
(5) 圖片預(yù)加載，將樣式表放在頂部，將腳本放在底部 加上時(shí)間戳。
【前端面試題及答案】相關(guān)文章：
web前端面試題及答案02-19
Web前端面試題目及答案06-09
前端面試題庫(kù)及答案05-09
前端面試題01-20
HTML前端開(kāi)發(fā)面試題及前端知識(shí)01-12
web前端面試題02-25
前端開(kāi)發(fā)面試題01-14
前端開(kāi)發(fā)面試題大全01-19
最新web前端面試題12-23