- position static 默認位置 靜態(tài)流
- relative 相對之前的位置進行定位 移動后再原來位置仍占據(jù)空間
- absolute 相對于父元素的定位 如果沒有父元素 相對于Body 在標準流中不占位置
- fixed 固定定位 在標準流中不占位置
- px em rem 區(qū)別
- px 像素 絕對單位 px相對于顯示器屏幕分辯率而言
- em是相對長度單位 相對于當前對象內(nèi)文本的字體尺寸 會繼承父級元素的字體大小 不是一個固定的值
- rem相對于HTML根元素
- 區(qū)別：px無法調(diào)整大小 em與rem可以縮放
- 什么是BFC叽讳？
- 塊級格式化上下文着饥，一個獨立的渲染區(qū)域
- 內(nèi)部的BOX會在垂直方向一個接一個的放置
- BOX垂直方向的距離由margin決定 屬于同一個BFC的兩個相鄰的BOX的margin會發(fā)生重疊
- BFC是一個隔離的獨立容器 容器里面的子元素不會影響到外面的元素
- 計算BFC高度時，浮動元素也參與計算
- box-sizing：U盤mh裕膀；規(guī)定盒模型的大小的計算方式 border-box從外邊框固定盒子大小 content-box從內(nèi)容固定盒子大小
- 選擇器優(yōu)先級
- !import>行內(nèi)樣式>id選擇器>類選擇器>標簽選擇器>通配符>繼承
- Iframe的作用
- 優(yōu)點：便于修改瞄崇，模塊分離
- 缺點：iframe的創(chuàng)建比一般DOM元素慢
iframe標簽會阻塞頁面的加載對于seo不友好- CSS3新特性
- 顏色 新增rgba hsla模式
- 文字陰影呻粹，背景 background-sizing background-origin設(shè)置背景圖片的遠點
- 盒子模型壕曼，邊框圓角、陰影等浊，漸變腮郊，過度，自定義動畫筹燕，媒體查詢轧飞，多欄布局，
- border-image撒踪，2D轉(zhuǎn)換过咬，3D轉(zhuǎn)換
- CSS引入的方式有哪些？link和@import的區(qū)別是制妄？
- 內(nèi)聯(lián)掸绞，內(nèi)嵌，外鏈耕捞，導入衔掸。
- 區(qū)別：同時加載。link無兼容性 @import在CSS2.1一下瀏覽器不支持
- link支持使用javascript改變樣式俺抽，后者不可
- 標簽上title為屬性提供信息 alt屬性不顯示時 用文字代表
- CSS reset 用來重置瀏覽器的CSS默認屬性
- CSS sprites 雪碧圖 用來減輕服務(wù)器對圖片的請求數(shù)量
- 清除浮動的方式
- .clearfix{
content:'';display:block;height:0;line-height:0;visibility:hidden;clear:both;- }
- .clearfix{
zoom : 1- }
- 設(shè)計一套方案 適應(yīng)不同的分辨路
- rem流式布局
- Bootstrap響應(yīng)式開發(fā) CSS3媒體查詢
- 超小屏幕 0-768 小屏幕 768-992 中屏幕992-1200 特大1200+
- 移動端和pc端分開的兩個頁面：針對性強敞映，代碼簡潔，加載快磷斧，開發(fā)效率高振愿，ipad體驗較差
- Bootstrap響應(yīng)式：兼容各種終端，代碼復(fù)雜弛饭，加載慢埃疫，
- 漸進增強，優(yōu)雅降級 ： 漸進增強是CSS3兼容思想從低版本開始往上版本考慮 孩哑。 優(yōu)雅降級是先從高版本考慮再考慮低版本兼容問題
- 改變元素外邊距用margin 改變元素內(nèi)填充用padding
- 在新窗口打開鏈接的方法是：target:_blank;
- DOCTYPE 是用來聲明文檔類型的
- display:none 與 visibility:hidden的區(qū)別是 display:none高度和寬度屬性消失不占位置 visibility:hidden 元素消失仍然在頁面占據(jù)位置
- AJAX請求步驟沒寫
- 怎么實現(xiàn)跨域問題
- 可以用jsonp jsonp的原理是動態(tài)創(chuàng)建script標簽 利用script標簽沒有跨域限制的“漏洞”,通過src來進行跨域
- iframe 缺點 iframe標簽比普通DOM標簽要慢 2. iframe會造成頁面阻塞 3.iframe不利于seo優(yōu)化
- ES6里面新出的fetch 語法糖 method : '' , .then(resopnse)轉(zhuǎn)化成JSON.parse 格式 然后進行數(shù)據(jù)渲染
- JS作用域 一個函數(shù)聲明就會產(chǎn)生一個作用域
- 閉包就相對于一個封閉起來的空間 外界無法訪問到閉包內(nèi)部的數(shù)據(jù) Js垃圾回收機制 當一個函數(shù)執(zhí)行完后 他的作用域會被收回 閉包里面的不會
- 通過在內(nèi)部聲明新函數(shù) 然后return 返回值
- 原型鏈 一個構(gòu)造函數(shù)會產(chǎn)生一個原型對象 通過prototype來訪問 同時new出來的實例化對象可以通過proto來訪問原型對象
- 一直向上找 直到大寫的Object.prototypt 再往上找是 null
- 實現(xiàn)繼承的方法有 原型鏈繼承 還有 經(jīng)典繼承
- 經(jīng)典繼承
function hzf()
function sss () {
hzf.call(this);
}
- 原型鏈繼承
function hzf () {}
var o = {}
hzf.prototype = o;
- 什么是事件捕獲/冒泡？
- 事件捕獲是從上級往下級尋找目標 冒泡是從下往上進行
- 開啟事件冒泡 element.addEventListener(eventName,handler,false);
- 關(guān)閉事件冒泡 e.stopPropagation e.stopPropagation關(guān)閉冒泡
- 開啟事件捕獲 element addEventListener( eventName, handler , true );
- 事件委托機制：就是本來交給你做的事 你不做 交給了別人來做就叫事件委托翠桦。
- 事件委托的好處是 ： 本來要給每一個li添加事件 但是現(xiàn)在直接給父元素直接添加事件 這樣做的好處是 提高性能横蜒，
- 動態(tài)添加進來的元素 也可以有之前的事件
- 字符串操作的方法
- slice方法返回字符串片段 slice[star,end)
- substring返回新字符串，參數(shù)不接受負值 substring[star,stop) 如果star與stop相等則返回一個空字符串销凑，
- 如果star比stop大丛晌，那么該方法提取字符串之前先交換這兩個參數(shù)
- substr返回的是新字符串 [star,length) 傳入兩個參數(shù)
- 第一個是開始的位置 第二個參數(shù)為從截取的長度（以第一個參數(shù)處為標準截取長度）
- 如果只有一個參數(shù)則一直截取到最后
- indexOf 返回字符串最后出現(xiàn)的位置 如果沒有匹配的字符串則返回-1
- concat() 方法用于連接兩個或多個字符串。
- 例如 var arr = '1' , arr1 = '3'
- arr.concat( arr1 ) 返回的是 '13'
- split將一個字符串分割 將結(jié)果字符串數(shù)組返回
- ==與===的區(qū)別 ==只判斷內(nèi)容 不判斷類型 ===既判斷內(nèi)容又判斷類型
- Js是面向?qū)ο笳Z言么 不是：因為跟傳統(tǒng)的語言有區(qū)別 是：它里面也有函數(shù) 對象 等等
- 面向?qū)ο?抽象性斗幼，封裝性澎蛛，繼承性
- 類的概念 對象是類的實例化
- js引擎只有一個線程 強迫異步事件排隊等待執(zhí)行
- 計時期是單線程的 需要等待上一個執(zhí)行完，
- js中一共有哪幾種數(shù)據(jù)類型 基本型 undefined,null,String,Number,Boolean
- 復(fù)雜類型 Object
- call apply 的區(qū)別 功能都是一樣的 參數(shù)不一樣 第一個參數(shù)都是綁定this的那個對象 第二個參數(shù)apply為數(shù)組
- call為一個又一個的數(shù)字
- this.
- 純粹的函數(shù)調(diào)用 this指向window
- 作為對象的方法調(diào)用 this指向?qū)ο?/li>
- 構(gòu)造函數(shù)的調(diào)用 this指向new出來的新對象
- apply,call this指向傳入的對象參數(shù)
- .bind直接this指向傳入的對象參數(shù)
- 箭頭函數(shù)直接this指向?qū)ο?內(nèi)部無法改變this方向
- 遞歸求5!
- function hzf( num ){
return num <=1 ? 1 : num * hzf( num - 1 )- }
- js異步加載
- 通過script標簽中的 async='async' H5中新增的屬性 IE8一下不支持
- 通過script標簽中的 defer = 'defer';
- AJAX也是異步加載
- iframe異步加載
- 例句BOM里至少4個對象 window方法5個
- window里對象: docuemnt,window,history,location,screen
- 方法 Alert() prompt() config() open() close()
- for in 用來循環(huán)數(shù)組或者對象OBJ
- 數(shù)組
- join 返回一個字符串 將字符串連接起來
- reverse 將數(shù)組各元素顛倒
- shift 刪除數(shù)組中第一個元素 返回刪除的值 length - 1
- pop 刪除數(shù)組最后一個元素 返回刪除的值 length - 1
- unshift 在數(shù)組前面添加一個或多個數(shù)組元素 長度改變
- push 往數(shù)組后邊添加一個或多個元素 長度改變
- concat連接數(shù)組
- sort 對數(shù)組進行排序
- splice 插入 刪除或者替換數(shù)組元素
- 日期時間
- var data = new Date();
- 強制轉(zhuǎn)換 轉(zhuǎn)化成字符串 toString String
轉(zhuǎn)化成Number Number() parseInt parseFloat轉(zhuǎn)化成布爾值 Boolean()- 隱式 拼接字符串 加減乘除 == ====
- H5中的新表單元素
- tel,email,url,number,search,range,color,time,date,
- HTML5中本地存儲概念
- cookie兼容所有瀏覽器 sessionStorage localStorage是H5新標簽 IE8一下不支持 cookie為doucment.cookie
- sessionStorage,localStorage為window
- cookie存儲 存儲大小4k
- sessionStorage 存儲5M 生命周期為關(guān)閉瀏覽器窗口 同一窗口數(shù)據(jù)共享
- localStorage約20M 生命周期 永久有效 除非手動刪除 多窗口共享
- getItem setItem removeItem
- 只能存儲字符串 用JSON.stringify
- post 與 get區(qū)別
- get效率較高比較快蜕窿，但是數(shù)據(jù)會暴露在瀏覽器url上 不安全
- post效率沒有g(shù)et 但是比較安全
- 文件上傳只能用post
- 自定義屬性 data H5新屬性 通過dataset屬性獲取
- 事件執(zhí)行三個階段 事件捕獲 事件處于目標階段 事件冒泡
- 性能優(yōu)化
- 減少HTTP請求次數(shù) 通過簡化頁面設(shè)計
- CSS JS 文件壓縮 盡量使用精靈圖 和字體圖標
- 圖片加載可以通過懶加載方式 減少請求次數(shù)
- 代碼性能 CSS 減少查詢層級 刪除重復(fù)的CSS
- HTML 減少DOM節(jié)點 加速頁面渲染谋逻，減少頁面重繪
- JS 避免使用全局變量 避免頻繁操作DOM節(jié)點 減少對象查找
- 避免XSS攻擊
- 模塊化的理解： 模塊化提高性能呆馁，讓開發(fā)者便于維護，邏輯相同的部分復(fù)用毁兆，
- 針對HTML CSS JS組織不同的單元進行組織代碼
- AMD requierjs 提前執(zhí)行 不過require從2.0開始也是延遲執(zhí)行
- CMD seajs 延遲執(zhí)行
- 平時用什么第三方插件 fullpage.js jq,zepto,swiper,jqueryUI ,animate.css
- 預(yù)加載的理解
- 在網(wǎng)頁全加載完之前 在頁面優(yōu)先顯示一些主要內(nèi)容 可以讓js預(yù)先從服務(wù)器加載圖片等資源設(shè)置src屬性緩存到本地提高訪問速度
- 圖片壓縮 gulp Sass
- 響應(yīng)式布局的時候輪播圖用兩張不同的圖片適配大屏幕和超小屏幕 可以減少超小屏幕流量消耗 加快響應(yīng)速度
- 同時保持圖片在大屏幕分辨率下失真
- 瀏覽器的內(nèi)核 Trident IE浙滤、360、騰訊
Gecko 火狐webkit 之前的谷歌presto 代表 歐鵬現(xiàn)在谷歌和歐鵬同用一個瀏覽器內(nèi)核 Blink- angular的雙向綁定原理：觸發(fā)$digest流程气堕，從rootscope開始遍歷 檢查所有watcher 進行數(shù)據(jù)更新
- angular里面并不存在定時的臟檢查 只有ng在指定事件觸發(fā)時才進行$digest流程
- 例如ng-click , $http,$location,$timeout,$interval 然后才執(zhí)行$digest
- angular與 Vue 的區(qū)別：angular用的是臟檢查 Vue用的是雙重綁定 getter,setter;
- img為行業(yè)替換元素 所以能設(shè)置寬高
- input框誰知disabled之后如何獲得value值 ： 可以將 disabled='disabled'改換成 readonly='readonly'
- Less特點：變量纺腊，混合，嵌套規(guī)則茎芭，函數(shù)揖膜，運算，作用域
- less原理：為CSS預(yù)解析梅桩，為CSS樣式生成工具
- gulp作用：Sass,less編譯壹粟，CSS JS 圖片壓縮 代碼壓縮，自動刷新摘投，雪碧圖制作煮寡，ESLint代碼規(guī)范檢查
- 200請求成功，302請求的資源臨時從不同URL響應(yīng)請求犀呼，400錯誤請求
- 500服務(wù)器端錯誤幸撕，502網(wǎng)關(guān)或者代理無效，網(wǎng)絡(luò)錯誤
- 了解Vue2.0與Vue1.0的區(qū)別
