最近面試前端崗位,匯總了一下前端面試題(JS+CSS)


JavaScript 運行機制

1. 單線程(用途決定,需要與用戶互動以及操作DOM)
2. 分同步任務(主線程)與異步任務(任務隊列),只有任務隊列通知主線程某個任務可以執行了,該 任務才會進入主線程執行。
放入異步任務的情況:
1. setTimeout、setInterval
2. DOM 事件
3. ES6中的 Promise
4. Ajax異步請求

javascript console.log(1); setTimeout(function() { console.log(3); }, 0); console.log(2); //運行結果是 1 2 3

$.fn 是什么意思

$.fn是指 jQuery 的命名空間,加上 fn 上的方法及屬性,會對 jQuery 實例有效

Ajax 的工作原理

1. 創建 Ajax 對象 (XMLHttpRequest/ActiveXObject)
2. 確定請求方式 get post等
3. 連接 open, 發送 send
4. 當對象完成 onreadystatechange 數據接收,判斷 http 響應狀態,執行回調函數

js的原型原型鏈

![](https://i.imgur.com/mdtMUoS.jpg)

html 中 title 和 alt 屬性有什么區別

html <img src="x.jpg" alt="alt信息" title="title信息"> 1. 當圖片不輸出信息時,顯示 alt 信息;正常輸出會不會顯示 alt 信息,鼠標放上去會出現 title 信息

css3新增了哪些屬性

垂直水平居中,講一下為什么這樣實現?

div{
  width: 100px;
  height: 100px;
  background: red;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -50px;
  margin-top: -50px;
}
1.position:absolute將div元素絕對定位,是以div元素的左頂點相對於父級元素(目前父級元素為瀏覽器窗口)的左頂點定位,所以要讓div元素實現真正的垂直水平居中就需要讓元素的中心位置點相對父級元素絕對定位,這時就需要將margin-left,margin-top值設為負的高寬的一半,使中心位置點到原來的左上角點,這樣就實現div元素的垂直水平居中。

::before和:after中的雙冒號和單冒號的區別

1.單冒號 css3偽類選擇器,雙冒號用於偽元素選擇器
2.::before就是以一個子元素的存在,定義在元素主題內容之前的一個偽元素,並不存在dom中,只存在頁面中

有一個高度自適應的div,里面2個div一個定寬,另一個填滿父元素

.father{
    position:relative;
}
.son1{
    width:100px;
    height:100%;
}
.son2{
    position:absolute;
    left:100%;
    right:0;
    top:0;
}

瀏覽器的最小字體為12px,如果還想再小,該怎么做

1.用圖片:如果是展示的內容基本是固定不變的話,可以直接切圖兼容性也完美(不到萬不得已,不建議);
2.找UI設計師溝通:為了兼容各大主流瀏覽器,避免后期設計師來找你撕逼,主動找TA溝通,講明原因 ————注意語氣,好好說話不要激動,更不能攜刀相逼;
3.CSS3:css3的樣式transform: scale(0.7),scale有縮放功能;

input文本框或是textarea文本域都支持placeholder,但當想改變placeholder默認文本內容的顏色時,怎么做

2.webkit內核的需要這樣-webkit-input-placeholder { color:#F00; }
1.firefox是input:-moz-placeholder { color: #F00;}

子元素設置margin-top作用於父元素時, 會產生margin合並問題,怎么去避免?

1.給父元素的::before偽元素設置為display:table屬性, 其中content屬性為必需
    .father:before{
        content: "";
        display: table;
    }
2.父元素設置padding
3.父元素設置border
4.父元素設置 overflow: hidden

清除浮動

css選擇器的優先級

h5的語義化部分

什么情況會發生跨域,怎么解決

1. 協議、域名、端口不同會發生跨域
2. 解決:代理、CORS后端添加信任域名(如 Access-Control-Allow-Origin)、JSONP、

怎么理解MVVM,MVC

cookie storage session

jQuery與Vue、Angular、React框架的區別

組件化、模塊化

前端開發流程

父子組件通信


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM