1. 程式人生 > >WEB前端面試之瀏覽器相關

WEB前端面試之瀏覽器相關

  • 瀏覽器有哪些常見的相容問題?
  1. 不同瀏覽器的內外補丁不同

        解決方法:萬用字元

*{
    margin:0;
    padding:0;
}

    2.浮動元素float,若有橫向margin,則在IE6顯示下margin會變大

        解決方法:在float元素標籤樣式中寫display:inline

    3.若元素的寬高小於5px,在IE6顯示下其實會比5px大

        解決方法:overflow:hidden;

  • IE瀏覽器與其他瀏覽器的不同
  1. 阻止事件冒泡 IE:window.event.cancleBubble=true;     非IE:e.stopPra...
  2. 阻止預設事件 IE:window.event.returnVlaue=false;     非IE:e.preventDefault
  3. 獲取滑鼠點選位置 IE:event.ClientX    非IE:event.PageX
  4. innerText使用 IE:使用innerText    非IE:使用Textcontent
  • web安全防護及原理
  1. sql注入原理

        通過sql命令插入到web表單遞交或輸入域名或頁面請求的查詢字串,最終欺騙伺服器執行惡意的Sql命令

        解決方法:1.對使用者輸入進行校驗,限制長度等

                         2.不要使用動態拼裝sql,可以使用引數化Sql或直接使用儲存過程進行資料查詢存取

                         3.不要使用管理員許可權的資料庫連線

                         4.不要把機密資訊明文存放

    2.xss:攻擊者往Web頁面裡插入惡意html標籤或js程式碼(如:在論壇中放一個惡意連線,使用者點開後,獲取用於的cookie資訊)

        解決方法:1.採用post而不是get

                            post月get的區別:(1)get通常用來接收資料,post用來發送資料

                                                          (2)get傳輸資料上有長度限制,而post沒有

                                                          (3)get請求引數會留在瀏覽器上,而post不會

                        2.避免直接在cookie洩漏使用者的隱私

    3.CSRF xss與csrf的區別:xss獲取資訊,不需要提前知道其他使用者頁面的程式碼和資料包

                                           csrf代替使用者完成指定動作,需要知道其他使用者頁面的程式碼和資料包

        解決方法:1.在客戶端頁面增加偽隨機數

                         2.通過驗證碼的方法

  • 一個頁面從輸入URL到頁面載入顯示完成,這個過程發生了什麼?
  1. 瀏覽器開啟一個執行緒來處理這個url請求,同時在遠端的DNS伺服器上啟動一個DNS查詢,獲得請求對應的IP地址
  2. 瀏覽器與遠端Web伺服器建立TCP連線
  3. 通過該TCP連線向遠端伺服器傳送'HTTP'的'get'請求,遠端伺服器找到資源並使用HTTP響應返回該資源
  4. Web伺服器提供資源服務,客戶端開始下載資源
  5. 接下里就是前端模組,瀏覽器解析HTML生成DOM樹,再根據CSS渲染生成CSS DOM樹,根據JSS生成DOM API操作。
  • 瀏覽器本地儲存

    在較高版本的瀏覽器中,js提供了sessionStorage和globalStorage。在html5中提供了localStorage來取代globalStorage。 

sessionStorage用於本地儲存一個會話(session)中的資料,這些資料只有在同一個會話中的頁面才能訪問並且當會話結束後資料也隨之銷燬。因此sessionStorage不是一種持久化的本地儲存,僅僅是會話級別的儲存。

而localStorage用於持久化的本地儲存,除非主動刪除資料,否則資料是永遠不會過期的。

  •  sessionStorage、localStorage和cookie的區別
  1. Web Storage是為了更大容量儲存而設計的,cookie有大小限制
  2. 每次請求新頁面的時候,cookie都會被髮送過去
  3. cookie需要作用域,不可以跨域訪問
  4. cookie需要前端開發者自己封裝setCookie和getCookie,而Web Storage有自己的方法,如setItem,getItem