html

基礎面試題

css 面試題

js 面試題

 

你做的頁面在哪些流覽器測試過？這些瀏覽器的內核分別是什么?

  • IE: trident內核
  • Firefox：gecko內核
  • Safari:webkit內核
  • Opera:以前是presto內核，Opera現已改用Google - Chrome的Blink內核
  • Chrome:Blink(基于webkit，Google與Opera Software共同開發

 

 

 HTTP狀態碼及其含義

  • 1XX：信息狀態碼
    • 100 Continue 繼續，一般在發送post請求時，已發送了http header之后服務端將返回此信息，表示確認，之后發送具體參數信息
  • 2XX：成功狀態碼
    • 200 OK 正常返回信息
    • 201 Created 請求成功并且服務器創建了新的資源
    • 202 Accepted 服務器已接受請求，但尚未處理
  • 3XX：重定向
    • 301 Moved Permanently 請求的網頁已永久移動到新位置。
    • 302 Found 臨時性重定向。
    • 303 See Other 臨時性重定向，且總是使用 GET 請求新的 URI。
    • 304 Not Modified 自從上次請求后，請求的網頁未修改過。
  • 4XX：客戶端錯誤
    • 400 Bad Request 服務器無法理解請求的格式，客戶端不應當嘗試再次使用相同的內容發起請求。
    • 401 Unauthorized 請求未授權。
    • 403 Forbidden 禁止訪問。
    • 404 Not Found 找不到如何與 URI 相匹配的資源。
  • 5XX: 服務器錯誤
    • 500 Internal Server Error 最常見的服務器端錯誤。
    • 503 Service Unavailable 服務器端暫時無法處理請求（可能是過載或維護
    •  

2- AJAX運行步驟與狀態值說明

在AJAX實際運行當中，對于訪問XMLHttpRequest（XHR）時并不是一次完成的，而是分別經歷了多種狀態后取得的結果，對于這種狀態在AJAX中共有5種，分別是。

readyState

0 - (未初始化)還沒有調用send()方法

1 - (載入)已調用send()方法，正在發送請求

2 - (載入完成)send()方法執行完成，

3 - (交互)正在解析響應內容

4 - (完成)響應內容解析完成，可以在客戶端調用了

 

if(ajax.readyState == 4 && ajax.status == 200) { putData(ajax.responseText);}

 

js  如何獲取http狀態碼  ajax  .status 

 

 

HTTP的幾種請求方法用途

  • GET方法
    • 發送一個請求來取得服務器上的某一資源
  • POST方法
    • 向URL指定的資源提交數據或附加新的數據
  • PUT方法
    • 跟POST方法很像，也是想服務器提交數據。但是，它們之間有不同。PUT指定了資源在服務器上的位置，而POST沒有
  • HEAD方法
    • 只請求頁面的首部
  • DELETE方法
    • 刪除服務器上的某資源
  • OPTIONS方法
    • 它用于獲取當前URL所支持的方法。如果請求成功，會有一個Allow的頭包含類似“GET,POST”這樣的信息
  • TRACE方法
    • TRACE方法被用于激發一個遠程的，應用層的請求消息回路
  • CONNECT方法
    • 把請求連接轉換到透明的TCP/IP通道

#

 

行內元素有哪些？塊級元素有哪些？空(void)元素有那些？行內元素和塊級元素有什么區別？

  • 行內元素有：a b span img input select strong
  • 塊級元素有：div ul ol li dl dt dd h1 h2 h3 h4… p
  • 空元素：<br> <hr> <img> <input> <link> <meta>
  • 行內元素不可以設置寬高，不獨占一行
  • 塊級元素可以設置寬高，獨占一行

 

4 從瀏覽器地址欄輸入url到顯示頁面的

 

head元素內有哪些元素

<title>, <base>, <link>, <style>, <meta>, <script>, <noscript>, <command>

列舉meta 標簽常見的屬性

 

    charset 

 

content

 

viewport  視口，應用場景、目的

 

   viewport-fit=cover

viewport-fit=contain  白邊

 

description

 

X-UA-Compatible     IE=edge,chrome=1

 

 

  • renderer

dns-prefetch

 

 

 cookies，sessionStorage 和 localStorage  indexdb

  • cookie 是網站為了標示用戶身份而儲存在用戶本地終端（Client Side）上的數據（通常經過加密）
  • cookie 數據始終在同源的 http 請求中攜帶（即使不需要），記會在瀏覽器和服務器間來回傳遞。
  • sessionStorage 和 localStorage 不會自動把數據發給服務器，僅在本地保存。
  • 存儲大小：
    • cookie 數據大小不能超過 4k。
    • sessionStorage 和 localStorage 雖然也有存儲大小的限制，但比 cookie 大得多，可以達到 5M 或更大。
  • 有效期（生命周期）：
    • localStorage: 存儲持久數據，瀏覽器關閉后數據不丟失除非主動刪除數據；
    • sessionStorage: 數據在當前瀏覽器窗口關閉后自動刪除。
    • cookie: 設置的 cookie 過期時間之前一直有效，即使窗口或瀏覽器關閉

 

safari 隱私模式

 

語義化 

便于開發者閱讀，更易維護，對爬蟲更友好

樣式丟失時，仍然能夠清晰的表達出層級關系

 

 

  • header    介紹信息
  • nav   導航欄
  • section  整體的一部分 一小節
  • article  一份獨立的內容
  • footer  
  • aside 側邊欄
  • main  文章的主要內容

 

 

 

  • i  專業術語 斜體
  • em  內容的強調  也是協議
  • strong  重要性
  • b 粗體
  • figure 嵌入式的內容

script

async  加載完就執行

defer  dom 解析完畢，渲染完再執行

如果有多個defer腳本，會按照它們在頁面出現的順序加載，而多個async腳本是不能保證加載順序的

 

跨域請求cookie是否會傳送到服務端

設置 withCredentials 為 true