基礎css
JS中使用typeof能獲得那些類型瀏覽器
基礎類型：number，string，boolean，null，undefined -- 棧 引用類型：object，function，array --堆 typeof只能區分值類型，不能區分引用類型 Number，String，Boolean，Undefined，Object，Function
JS內置對象緩存
數據封裝類對象：Array，String，Boolean，Array，Object 其餘對象：Function，Math，Date，Arguments，Error，RegExp ES6：Promise，Map，Set，Proxy，Symbol，Reflex
DOM元素e的e.getAttribute('propName')和e.propName有什麼區別和聯繫dom
e.getAttribute()是標準的DOM操做文檔元素屬性的方法 e.propName一般是在HTML訪問特定元素的特性，瀏覽器解析後生成對應對象 e.getAttribute()返回的值多是字符串或者''或者null e.propName返回的值多是字符串，對象，布爾值，undefined 大部分attribute和property是一一對應關係。修改其中一個會影響另外一個。好比id，title 可是一些attribute和property不是對應關係，好比<input value="defaultValue" /> ,他們之間修改是不會相互影響的
offsetWidth/offsetHeight和clientWidth/clientHeight和scrollWidth/scrollHeight的區別async
offsetWidth/offsetHeight 返回值包含 content + padding + border，效果與 e.getBoundingClientRect()相同 clientWidth/clientHeight 返回值只包含 content + padding，若是有滾動條，也不包含滾動條 scrollWidth/scrollHeight 返回值包含 content + padding + 溢出內容的尺寸
描述瀏覽器的渲染過程，DOM樹和渲染樹的區別ide
解析HTML生成DOM樹，並請求css/js/image css文件下載完成，構成CSSOM 而後DOM樹和CSSOM一塊兒生成Render Tree渲染樹 佈局，計算每一個節點在屏幕的位置 顯示，經過顯卡把頁面畫到屏幕上 區別 DOM樹和HTML一一對應，包含head和隱藏部分 渲染樹不包含head和隱藏部分，可是每一個節點都有對應的css屬性
重繪和迴流的區別和關係函數
重繪：當渲染樹中的元素外觀（顏色）發生改變，不影響佈局 迴流：當渲染樹中的元素佈局（尺寸，位置，隱藏）發生改變 JS獲取layout屬性值（offsetLeft，scrollTop）也會引發迴流，由於瀏覽器須要迴流從新計算屬性 關係 迴流必將引發重繪，重繪不必定會引發迴流
重回和迴流的優化方案有哪些佈局
須要對元素進去賦值操做時，能夠先對元素進行隱藏，操做完後顯示 須要建立多個DOM節點時，一次性的加入到document 緩存layout屬性，如var left = elem.offsetLeft,這樣只產生一次迴流 儘可能避免使用table 避免使用css表達式，每次使用都會從新計算值 儘可能使用css屬性簡寫
script是否影響首屏加載時間flex
首先瀏覽器的解析過程 1：瀏覽器解析生成DOM樹 2：瀏覽器解析css生成CSSOM 3：而後CSSOM和DOM樹生成渲染樹 4：佈局 5：渲染 分析： 若是js放在head中，會中斷瀏覽器解析DOM樹，致使首屏空白時間變長。 若是js放在body中，首先首屏空白時間不會受影響，可是會影響完整DOM樹的渲染時間 若是js放在body以後，那麼不會影響首屏空白時間，也不會影響完整DOM樹的渲染時間。換句話就是遇到script以前，已經生成完整的DOM樹 總結： JS會阻塞DOM的解析，也就是JS會阻塞DOM樹的生成 瀏覽器遇到js且沒有defer或者async屬性的標籤，會觸發頁面渲染 大白話 瀏覽器並不知道js內容是什麼，那就乾脆聽下來等待JS解析完畢，才解析DOM樹
css阻塞的理解優化
首先仍是先解釋瀏覽器的渲染過程 1：瀏覽器解析生成DOM樹 2：解析CSS生成CSSOM 3：CSSOM和DOM樹生成渲染樹 4：layout 5：paint 首先咱們能夠看出CSS不會阻塞DOM樹的渲染 可是咱們能夠清楚看到會阻塞渲染樹的渲染 結論 css阻塞頁面的渲染 css放在head中，渲染樹必須等待CSSOM生成以後渲染 css阻塞JS 由於js進行dom操做的時候必須知道dom中每一個節點的屬性值
解析js中的做用域和變量提高
在解析這以前咱們先了解下什麼是執行上下文 執行上下文 範圍：一段script或者一個函數 全局：變量定義，函數聲明 函數：變量定義，函數聲明，this，arguments 從執行上下文能夠看出js的做用域有全局做用域和函數做用域