摘要:例如浮動元素會形成浮動元素內(nèi)部子元素主要受該浮動元素影響,但是兩個浮動元素互相不影響。
1、有關(guān)BFC的理解 2、盒模型的理解 3、box-sizing的理解 4、漸進增強 VS 優(yōu)雅降級 5、url->頁面加載完成的整個流程 6、js組成部分 7、如何跨域訪問 8、js判斷數(shù)組 9、嚴格模式 10、ajax的優(yōu)缺點 11、HTML、XML、XHTML 有什么區(qū)別 12、html語義化 13、內(nèi)容與樣式分離 14、meta標簽的使用 15、文檔聲明的作用 16、嚴格模式和混雜模式 17、的作用 18、常見瀏覽器內(nèi)核 19、頁面導(dǎo)入樣式時,使用link和@import有什么區(qū)別 20、瀏覽器內(nèi)核的理解有關(guān)BFC的理解
BFC用來格式化塊級盒子
BFC: 提供一個環(huán)境,html元素會在這個環(huán)境中按照一定的規(guī)則進行布局。
ex: 例如浮動元素會形成bfc,浮動元素內(nèi)部子元素主要受該浮動元素影響,但是兩個浮動元素互相不影響。
這個可以理解為一個獨立容器,里邊規(guī)則不會影響到外邊。
那么什么情況下會生成bfc呢:
1、浮動元素,float除none以外的值
2、絕對定位,position(absolite,fixed)
3、dispaly = inline-blocks|table-cells|table-captions
4、overflow除visible以外的值
作用:
1、可以阻止元素被浮動元素覆蓋 2、包含浮動元素 3、如果屬于同一個bfc的兩個元素上下margin會發(fā)生重疊,但如果兩個元素屬于兩個不同的bfc那么margin就不會發(fā)生重疊盒模型的理解
css盒子模型,包含了content,padding,border,margin
這些基本的比如比如哪兒是content大家都了解我就說了在設(shè)置width = 300px時代表的是content的寬度那么最終的寬度是content+padding+border+margin.
css外邊距合并
剛才在bfc中提到,在一個bfc中,css外邊距是會發(fā)生重疊的,解決方法就是放在兩個bfc中。當我們使用盒模型的時候需要注意的是瀏覽器的兼容性,這個很好解決在html中聲明 ,ul在mozilia默認有padding值,而在IE中只有margin有值
盒模型中我們常使用一個屬性叫box-sizing,這會多帶帶起一頁,這也是面一經(jīng)常出的問題
box-sizing: content-box|border-box|inherit
content-box是默認值,總寬度= margin+border+padding+width
border-box: 在css中設(shè)置的width = border + padding + content,那么總寬度 = margin + width常在box寬度是100%,又想要兩邊有內(nèi)間距
inherit: 這就不用說了,是繼承
漸進增強:低瀏覽器實現(xiàn)基本功能,高級瀏覽器實現(xiàn)交互、效果達到更好的體驗
優(yōu)雅降級: 在高級瀏覽器實現(xiàn)完整功能,然后針對低級瀏覽器進行hack以便低級瀏覽器能夠正常運行
兩者是因為各種版本的瀏覽器對css3的支持情況而不同所造成的
1、瀏覽器查詢域名對應(yīng)的IP地址
2、瀏覽器根據(jù)IP地址與服務(wù)器建立socket連接
3、瀏覽器與服務(wù)器進行通信:瀏覽器請求,服務(wù)器處理請求
4、瀏覽器與服務(wù)器斷開連接
這個內(nèi)容太多了,我會專門寫一篇blog來解釋,但是面試這些回答這些就夠了
1、ECMAScript 定義腳本語言的屬性、方法和對象
2、文檔對象類型(DOM):把整個頁面規(guī)劃成由節(jié)點層級構(gòu)成的文檔
3、瀏覽器對象模型(BOM):處理瀏覽器寬口和框架
1、jsonp跨域訪問
2、window.name進行跨域
3、html5中的window.postMessage方法
4、http頭部信息中加入origin
這個在我一片blog中專門講到了兩種jsonp和origin如今最常用的兩種跨域請求方式
return Object.prototype.toString.call(arg) === "[object Array]"嚴格模式
使用方法:進入嚴格模式的標志 "use strict",語法更加嚴格,更安全,提高運行速度。
1、全局變量顯示聲明
2、靜態(tài)綁定:屬性和方法歸屬的對象,在編譯階段就確定
3、增強的安全措施:①禁止this指向全局對象②禁止在函數(shù)內(nèi)部遍歷調(diào)用棧
4、禁止刪除變量,除非創(chuàng)建對象使用configurable=true
5、顯示報錯:對對象的只讀屬性,只有g(shù)etter的對象賦值,對禁止擴展的對象添加新屬性都會報錯
6、重名錯誤:對象不能有同名的參數(shù),函數(shù)不能有重名的參數(shù)
7、禁止八進制表示法
8、禁止arguments賦值,不會追蹤參數(shù)的變化,禁止使用arguments.callee
9、函數(shù)必須聲明在頂層
10、新增保留字
優(yōu)點:減輕服務(wù)器的負擔(dān),按需取數(shù)據(jù),最大程度減少冗余請求,局部刷新。
缺點:瀏覽器之間有差異,對流媒體和移動設(shè)備支持不夠好
html:超文本標記語言,顯示信息,不區(qū)分大小寫
xhtml:升級版的html,區(qū)分大小寫
xml:可擴展標記語言被用來傳輸和存儲數(shù)據(jù)
直觀認識標簽和屬性的作用,便于閱讀和維護
內(nèi)容與樣式分離可以確保網(wǎng)頁平穩(wěn)退化,易于維護
meta標簽的使用meta name="keyword" 告訴搜素引擎網(wǎng)頁的關(guān)鍵詞
meta name="description" 告訴搜素引擎站點的內(nèi)容
mata name="author" content="name"站點制作望著
meta name="viewport" content="width=device-width, initial-scale=1.0"
響應(yīng)式頁面
讓瀏覽器解析器知道需要用什么規(guī)范來解析文檔
嚴格模式和混雜模式嚴格模式:瀏覽器最高標準呈現(xiàn)頁面
混雜模式:頁面以一種比較寬松的向后兼容的方式顯示
使用html5標準來解析渲染頁面,如果不寫就進入混雜模式
常見瀏覽器內(nèi)核IE 用的是trident firefox Gecko opera Blink safari Chrome webkit頁面導(dǎo)入樣式時,使用link和@import有什么區(qū)別
頁面被加載時,link被同時加載,@import會頁面加載完成后在加載
瀏覽器內(nèi)核的理解渲染引擎和JS引擎
渲染引擎:負責(zé)取得網(wǎng)頁的內(nèi)容、整理訊息,以及計算網(wǎng)頁的顯示方式
JS引擎:解析和執(zhí)行js來實現(xiàn)網(wǎng)頁的動態(tài)效果
我的github,你的關(guān)注是我不斷前進的動力https://github.com/skychenbo/...
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/112631.html
摘要:整理收藏一些優(yōu)秀的文章及大佬博客留著慢慢學(xué)習(xí)原文協(xié)作規(guī)范中文技術(shù)文檔協(xié)作規(guī)范阮一峰編程風(fēng)格凹凸實驗室前端代碼規(guī)范風(fēng)格指南這一次,徹底弄懂執(zhí)行機制一次弄懂徹底解決此類面試問題瀏覽器與的事件循環(huán)有何區(qū)別筆試題事件循環(huán)機制異步編程理解的異步 better-learning 整理收藏一些優(yōu)秀的文章及大佬博客留著慢慢學(xué)習(xí) 原文:https://www.ahwgs.cn/youxiuwenzhan...
摘要:在此基礎(chǔ)上加入了回調(diào)函數(shù),加載完之后會執(zhí)行中定義的函數(shù),所需要的數(shù)據(jù)會以參數(shù)的形式傳遞給該函數(shù)。通常的做法是,為它們指定回調(diào)函數(shù)。 前端面試題總結(jié)——JS(持續(xù)更新中) 1.javascript的typeof返回哪些數(shù)據(jù)類型 Object number function boolean underfind string 2.例舉3種強制類型轉(zhuǎn)換和2種隱式類型轉(zhuǎn)換? 強制(parseIn...
摘要:前言一直混跡社區(qū)突然發(fā)現(xiàn)自己收藏了不少好文但是管理起來有點混亂所以將前端主流技術(shù)做了一個書簽整理不求最多最全但求最實用。 前言 一直混跡社區(qū),突然發(fā)現(xiàn)自己收藏了不少好文但是管理起來有點混亂; 所以將前端主流技術(shù)做了一個書簽整理,不求最多最全,但求最實用。 書簽源碼 書簽導(dǎo)入瀏覽器效果截圖showImg(https://segmentfault.com/img/bVbg41b?w=107...
摘要:等知名網(wǎng)站已經(jīng)開始測試并使用格式。頁面加載速度更快結(jié)構(gòu)化清晰頁面顯示簡潔。表現(xiàn)與結(jié)構(gòu)相分離。易于優(yōu)化搜索引擎更友好,排名更容易靠前。用于替換當前元素,用于在當前文檔和引用資源之間確立聯(lián)系。 前端面試題總結(jié)——HTML(持續(xù)更新中) 1.什么是HTML? HTML:HyperText Markup Language超文本標記語言 2.XHTML和HTML有什么區(qū)別 HTML是一種基本的W...
摘要:等知名網(wǎng)站已經(jīng)開始測試并使用格式。頁面加載速度更快結(jié)構(gòu)化清晰頁面顯示簡潔。表現(xiàn)與結(jié)構(gòu)相分離。易于優(yōu)化搜索引擎更友好,排名更容易靠前。用于替換當前元素,用于在當前文檔和引用資源之間確立聯(lián)系。 前端面試題總結(jié)——HTML(持續(xù)更新中) 1.什么是HTML? HTML:HyperText Markup Language超文本標記語言 2.XHTML和HTML有什么區(qū)別 HTML是一種基本的W...
閱讀 2893·2021-11-18 10:02
閱讀 3550·2021-09-22 15:50
閱讀 2502·2021-09-06 15:02
閱讀 3662·2019-08-29 16:34
閱讀 1856·2019-08-29 13:49
閱讀 1362·2019-08-29 13:29
閱讀 3775·2019-08-28 18:08
閱讀 3080·2019-08-26 11:52