1， html和xml有什麼差別
html是超文本标記語言 xml是可擴充标記語言
html文法寬松，xml文法嚴謹
html使用固有标記，xml沒有固有标記
html标簽預定義，xml标簽可擴充，可定義
html是用來顯示資料的，xml是用來描述和存儲資料的
2， css有哪幾種選擇器？權重的優先級？
第一種為 屬性選擇器
第二種為 id選擇器
第三種為 class選擇器
第四種為 僞類選擇器
第五種是 後代選擇器
第六種是 标簽選擇器
第七種是 通用選擇器
第八種是 僞元素選擇器
- 第一等：代表内聯樣式，如: style=””，權值為1000。
- 第二等：代表ID選擇器，如：#content，權值為0100。
- 第三等：代表類，僞類和屬性選擇器，如.content，權值為0010。
- 第四等：代表類型選擇器和僞元素選擇器，如div p，權值為0001。
- 通配符、子選擇器、相鄰選擇器等的。如*、>、+,權值為0000。
- 繼承的樣式沒有權值。
3， 網頁有哪幾部分組成？
結構層：html
表示層：css
行為層：js和dom
4， 一個200*200的div在不同分辨率螢幕上下左右居中，用css實作
Div{
position: absolute;
width: 200px;
height: 200px;
top: 50%;
left: 50%;
margin-top: -100px;
margin-left: -100px;
}
5， 闡述清楚浮動的幾種方式
第一種 父級div定義高度height 适合高度固定的布局
第二種 父級div定義 overflow：hidden
第三種 結尾處加空标簽 clear： both 讓父級自動擷取高度
第四種 父級div定義 僞類:after 和 zoom
6， 解釋css sprites，如何使用？
CSS Sprites其實就是把網頁中一些背景圖檔整合到一張圖檔檔案中，再利用CSS的“background-image”，“background- repeat”，“background-position”的組合進行背景定位，background-position可以用數字能精确的定位出背景圖檔的位置。
CSS Sprites為一些大型的網站節約了帶寬，讓提高了使用者的加載速度和使用者體驗，不需要加載更多的圖檔
7， 如何用原生js給一個按鈕綁定兩個onclick事件？
Var btn1 =document. getElementsById(“btn”);
btn1.addEnventListener(“click”,”hello1);
btn1.addEnventListener(“click”,”hello2);
function hello1(){
alert(“hello1”);
}
function hello2(){
alert(“hello2”);
}
8, 拖曳會用到哪些事件？
Dragstart
Dragenter
Dragover
Dragleave
Drag
Drop
Dragend
9, 請列舉jQuery中選擇器？
1， 基本選擇器
ID，class，元素之類的
2， 層級選擇器
傳回的是jQuery對象才可以進行的鍊式操作
如 後代元素，子元素，兄弟元素，相鄰元素
3， 過濾選擇器
基本過濾, 内容過濾, 可見性過濾, 屬性過濾, 子元素過濾和表單對象屬性過濾選擇器
10，JavaScript中有哪些定時器，他們的差別和用法是什麼？
SetTimeout 隻會執行一次
SetInterval 會一直重複執行
方式都為：settimeout（函數，時間）
11，請描述一下cookies sessionstorage 和localstorage差別
相同點：都儲存在用戶端上
不同點：1 儲存大小
Cookies 資料大小不能超過4k
Sessionstorage和Localstorage 比cookies大 ，可以達到5m或更多
2有效時間
Localstorage 儲存持久資料，浏覽器關閉後也不會丢失，除非主動删除資料
Sessionstorage 資料在關閉遊覽器之後自動删除
Cookies 設定的cookies過期時間之前一直有效，即使視窗和遊覽器關閉。
3資料與伺服器之間的互動方式
Cookies的資料會自動的傳遞到伺服器，伺服器端也可以寫cookies到用戶端
Sessionstorage和localstorage 不會上傳到伺服器，僅在本地儲存
12，計算一個數組arr所有元素的和
//可以通過 document.getelmentbyid（）.value;來擷取輸入框中的值
function sum2(){
var arr1=[1,2,3,4,5,6,7,8,9];
var sum1=0;
for (var i=0;i<=arr1.length;i++) {
if (typeof arr1[i]==“number”) {
sum1+=arr1[i];
}
}
document.write(sum1);
}
13，編寫一個方法去掉數組裡的重複内容 var arr=[1,2,3,4,5,1,2,3]
function arr1(){
var arr2 = [1,2,3,4,5,1,2,3];
var s= [];
for(i= 0;i<arr2.length;i++){
if(s.indexOf(arr2[i]) == -1){
s.push(arr2[i]);
}
}
console.log(s);
}
14，document.write和innerHTML的差別是什麼？
Document.write是直接寫入到頁面的内容流，如果之前沒有調用document.Open。那麼浏覽器會自動調用open，頁面被重寫
innerHTML将内容寫入某個DOM節點，不會導緻頁面全部重繪。精準。
15，ajax的步驟
Ajax 異步JavaScript和xml 能夠局部重新整理網頁資料而不是重新加載整個網頁
第一步，建立xmlhttprequest對象，var xmlhttp = new XmlHTTPrequest（）；
Xmlhttprequest對象用來和伺服器交換資料
Var xhttp；
If(windows.XMLHttpRequest){
//現在主流浏覽器
Xhttp = new XMLHttpRequst();
}else{
Xhttp =new ActiveXObject(“Mirosoft.XMLHTTP”);
}
第二步，xmlHTTPrequest對象的open（）和send（）方法發送資源請求到伺服器，
第三步，使用xmlhttprequest對象的responseText或responseXML屬性獲得伺服器的響應
第四部，onreadystatechange函數，當發送請求到伺服器，我們想要伺服器響應執行一些功能就需要使用使用onreadystatechange函數，每次xmlhttprequest對象的readystate發生改變都會觸發onreadystatechange函數。
16，xml和json的差別，請用四點來形容
Json相對于xml來講，資料體積小，傳輸速度快
Json與JavaScript更好互動，更好的資料互動
Xml對資料描述性比較好
Json的解析速度要遠遠快于XML
17，box-sizing常用的屬性有哪些？有哪些作用？
屬性值
· box-sizing：content-box
· box-sizing：border-box
· box-sizing：inherit
content-box
· 這是box-sizing的預設屬性值
· 是CSS2.1中規定的寬度高度的顯示行為
· 在CSS中定義的寬度和高度就對應到元素的内容框
· 在CSS中定義的寬度和高度之外繪制元素的内邊距和邊框
border-box
· 在CSS中微元素設定的寬度和高度就決定了元素的邊框盒
· 即為元素在設定内邊距和邊框是在已經設定好的寬度和高度之内進行繪制
· CSS中設定的寬度和高度減去邊框和内間距才能得到元素内容所占的實際寬度和高度
(Q1)box-sizing: content-box|border-box|inherit;
(Q2)content-box:寬度和高度分别應用到元素的内容框。在寬度和高度之外繪制元素的内邊距和邊框(元素預設效果)。
border-box:元素指定的任何内邊距和邊框都将在已設定的寬度和高度内進行繪制。通過從已設定的寬度和高度分别減去邊框和内邊距才能得到内容的寬度和高度。
18，使一個300*200的div實作螢幕水準居中
前面已經有一種方法了
第二種方法：
div{
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
margin: auto;
position: absolute;
height: 200px;
width: 300px;
}
第三種方法是利用jQuery
$(window).resize(function(){
$(".myblock").css({
position: "absolute",
left: ($(window).width() - $(".myblock").outerWidth())/2,
top: ($(window).height() - $(".myblock").outerHeight())/2 });
});
此外在頁面載入時，就需要調用resize()方法
$(function(){
$(window).resize();
});
19，三個盒子，左右定寬，中間自适應的方法有幾個？
第一種方法：左右采用浮動 中間采用margin-left和margin-right的方法
代碼：
11 33 22
第二種方法：左右采用絕對定位，中間采用margin-left和margin-right
代碼：
11
33
22
第三種方法 負margin值
main content left content right
#main {
float: left;
width: 100%;
}
#mainContainer {
margin: 0 230px;
height: 200px;
background: green;
}
#left {
float: left;
margin-left: -100%;
width: 230px}
#right {
float: left;
margin-left: -230px;
width: 230px;
}
#left .inner,
#right .inner {
background: orange;
margin: 0 10px;
height: 200px;
}
20，js有幾種資料類型？其中基本資料類型有哪些？
基本資料類型有 Boolean，undefined，null，number，string
應用類型有 object，array，function
21，undefined和null的差別
Null 代表空值，代表一個空對象指針，一個特殊的對象值
Undefined 是未定義，類型也是undefined
22，http和https有什麼差別？如何靈活運用？
Http是http運作在TCP之上，傳輸内容是明文，用戶端和伺服器無法驗證對方身份。
HTTPS是http運作在SSL/tls之上，SSL/tls運作在TCP上，所有内容都是經過加密。加密采用對稱加密，但是秘鑰用伺服器證書進行非對稱加密。伺服器和用戶端都是可以互相驗證身份。
23，常見的Http狀态碼
2開頭，請求成功，表示成功處理了請求的狀态代碼
3開頭，請求重定向，表示完成請求，需要進一步操作，一般是重定向
4開頭，請求錯誤，表示請求出錯，妨礙了伺服器的處理
5開頭，這些狀态碼表示伺服器在嘗試處理請求時發生内部錯誤，伺服器本身出錯而不是請求出錯
24，如何進行網站性能的優化
原因：使用者角度 加載速度提高，更好的互動體驗
服務商角度 減少頁面請求，降低帶寬，節省資源
方法：1，JavaScript優化和打包
2，按需加載資源
3，在使用DOM操作庫時用上array-ids
4，緩存
5，啟用HTTP/2
6，應用性能分析
7，使用負載均衡方案
8，同構
9，使用索引加快資料庫查詢
10，使用更快的轉譯方案
11，避免因JavaScript和css的使用而阻塞渲染
12，圖檔編碼優化
25，react和vue有哪些不同，說說你對這兩個架構的看法
相同點：都支援伺服器渲染
都有virtual DOM，元件化開發，通過props參數進行父子元件資料的傳遞，都實作了webComponent規範
資料驅動視圖
都支援native方案，react的react native 和vue的weex
不同點：react嚴格上隻針對MVC的view層，vue則是mvvm模式
Virtual DOM不一樣，vue會跟蹤每一個元件的依賴關系，不需要重新渲染整個元件樹，而對于react來說，每次應用狀态被改變，全部元件都會被重新渲染，是以react需要shouldComponentUPdate這個生命周期函數來進行控制。
元件的寫法不一樣。。。
資料綁定，vue是雙向的，react是單向的
State對象在react應用中不可變的，需要使用setstate方法更新狀态，在vue中state對象對象不是必須的，資料由data屬性在vue對象中管理
26，什麼是mvvm mvc 有什麼差別，原理？
1，MVC（model-view-controller）
MVC是比較直覺的架構模式，使用者模式->view(負責接收使用者的操作輸入)->controller(業務邏輯處理)->view(将結果回報給view)
2，MVVM（model-view-viewmodel）
将”資料模型資料雙向綁定”的思想作為核心，是以model和view沒有什麼關系，之後痛過viewmodel進行互動，而model和viewmodel之間的互動是雙向的，是以資料的視圖的變化會同時修改資料源，而資料源的資料變化也會立刻反應view。
27，px和em的差別
Px表示像素，是一個絕對機關，不會因為其他元素而改變
Em表示相對于父元素的字型大小，em是相對機關，會受到其他元素的影響
28，優雅降級和漸進增強
漸進增強（向上相容）：一開始就針對低版本浏覽器進行構築界面，完成基本功能，然後在針對進階浏覽器進行效果，互動，追加功能達到更好的體驗
優雅降級（向下相容）：一開始就建構站點的完整功能，然後針對浏覽器測試和修複。
29，eval()的作用
把字元串參數解析成JS代碼并運作，并傳回執行的結果；
例如：eval(“2+3”);//執行加運算并傳回執行的結果。
Eval(“var age=10”);//聲明一個變量age
Eval()的作用域
Function(){
Eval(“var x=1”);//等效于var x=1；
Console.log(x);//輸出1
}
a();
console.log(x);//錯誤，沒有定義x
30，js哪些操作會洩露記憶體
1， 意外的全局變量引起的記憶體洩漏
2， 閉包引起的
3， 沒有清理DOM元素的應用
4， 被遺忘的定時器或者回調
5， 子元素存在引起的
31，浏覽器緩存有哪些？通常的緩存有哪幾種？
1， HTTP緩存
2， Websql
3， Cookies
4， Localstorage
5， Sessionstorage
6， Flash緩存
32，bootstrap響應式原理
百分比布局+媒體查詢
33，關于js事件冒泡與js時間代理（事件委托）
1， 事件冒泡：
當一個子元素被觸發時（如onclick），該事件會從事件源（被觸發的子元素）開始逐級向上傳播，出發父級元素的點選事件。
2， 事件委托：
将子元素的事件通過冒泡的形式交由父元素來執行
例如：
- var ul = document.getElementById(‘parentUl’);
-
ul.onclick=function (event) { -
var e = event||window.event, -
source = e.target || e.srcElement;//target表示在事件冒泡中觸發事件的源元素，在IE中是srcElement -
if(source.nodeName.toLowerCase() == "li"){ //判斷隻有li觸發的才會輸出内容 -
alert(source.innerHTML); -
} -
stopPropagation(e); //阻止繼續冒泡 -
}; -
function addElement() { -
var li = document.createElement('li'); -
li.innerHTML="我是新孩子"; -
ul.appendChild(li); -
}
34，css樣式覆寫規則
規則一：由于繼承而發生樣式沖突時，最近祖先獲勝（就近原則）；
規則二：繼承樣式和直接指定的樣式沖突時，直接指定的樣式獲勝
規則三：直接指定樣式發生沖突時，樣式權值高的獲勝；
規則四：樣式權值相等時，後者獲勝。
規則五：！important的樣式不被覆寫。
35，請簡要描述margin重合問題以及解決方式
1，同向margin重疊
這時候重疊之後的margin值由發生重疊兩片的最大值決定；如果其中一個出現負值，則由最大的正邊距減去絕對值最大的負邊距，如果沒有最大正邊距，則由0減去絕對值最大的負邊距。
解決方法：
（1） 在最外層的div中加入overflow：hidden；zoom：1；（zoom這個屬性是ie專有屬性，除了設定或者檢索對象的縮放比例之外，它還有可以觸發ie的haslayout屬性，清除浮動，清除margin重疊等作用。）
（2） 在最外層加入padding：1px；
（3） 在最外層加入：border：1px solid #000000;
2,異向重疊問題：
Float：left（ie6專屬，或解決ie8+等浏覽器的同向重疊問題）
36，position的值,relative\absolute\fixed分别相對于進行誰定位？
Absolute：絕對定位 相對于最近一級
Fixed：絕對定位 相對于浏覽器視窗或frame進行定位
Relative：相對定位 相對于其在普通流的位置
Static：預設值 沒有定位
Sticky：粘性定位 文檔位置根據正常文檔流計算得出
37，什麼是閉包，如何使用，為什麼使用？
閉包就是在函數内定義一個函數。
優點：可以讀取函數内部的變量 這些變量的值始終儲存在記憶體中
缺點：記憶體消耗大且容易造成記憶體洩漏 閉包會在父函數外部，改變父函數内部變量的值
38，請解釋一下jsonp的工作原理，以及它為什麼不是真正的ajax。
Jsonp是一個簡單的跨域方式；HTML中的script标簽可以加載并執行其他域的javascript，于是我們可以通過script标記來動态加載其他域的資源
JSONP易于實作，但是也會存在一些安全隐患，如果第三方的腳本随意地執行，那麼它就可以篡改頁面内容，截獲敏感資料。但是在受信任的雙方傳遞資料，JSONP是非常合适的選擇。
AJAX是不跨域的，而JSONP是一個是跨域的，還有就是二者接收參數形式不一樣
39，請解釋一下JavaScript的同源政策。
同源政策規定跨域之間的腳本是隔離的，一個域的腳本不能通路和操作另外一個域的絕大部分屬性和方法。當兩個域具有相同的協定，相同的端口，相同的host，那麼我們就可以認為是相同的域。
40，怎樣添加，移除，移動，複制，建立和查找節點？
1， 建立新節點
Createdocumentfragment（） //建立一個DOM片段
CreateElement() //建立一個具體的元素
CreateTextNode() //建立一個文本節點
2， 添加，移除，替換，插入
Appendchild（）//添加
Removechild（） //移除
Replacechild（） //替換
InsertBefore（） //插入
3， 查找
GetelementsBytagname（）//通過标簽名
Getelementsbyname（）//通過元素的name屬性的值
GetelementbyId（）//通過元素id，唯一性
41，垃圾回收機制方式及記憶體管理
垃圾回收機制
1， 定義和用法：垃圾回收機制，執行環境負責管理代碼執行過程中使用的記憶體。
2， 原理：垃圾回收機制會定期找出那些不再使用的變量，然後釋放其記憶體。但是這個過程不是實時的，開銷較大，是以會按固定時間間隔周期性的執行。
3， 執行個體如下：
function fn1() {
var obj = {name: ‘hanzichi’, age: 10};
}
function fn2() {
var obj = {name:‘hanzichi’, age: 10};
return obj;
}var a = fn1();var b = fn2();
fn1中定義的obj為局部變量，而當調用結束後，出了fn1的環境，那麼該塊記憶體會被js引擎中的垃圾回收器自動釋放；在fn2被調用的過程中，傳回的對象被全局變量b所指向，是以該塊記憶體并不會被釋放。
4， 标記回收政策：标記清除和引用計數。
42，jQuery的事件委托方法blind，live，delegate，on之間有什麼差別？
（1），blind
定義和用法：主要用于給選擇到的元素上綁定特定事件類型的監聽函數；
文法：bind(type,[data],function(eventObject))；
特點：
(1)、适用于頁面元素靜态綁定。隻能給調用它的時候已經存在的元素綁定事件，不能給未來新增的元素綁定事件。
(2)、當頁面加載完的時候，你才可以進行bind()，是以可能産生效率問題。
執行個體如下：$( “#members li a” ).bind( “click”, function( e ) {} );
（2），live
定義和用法：主要用于給選擇到的元素上綁定特定事件類型的監聽函數；
文法：live(type, [data], fn);
特點：
(1)、live方法并沒有将監聽器綁定到自己(this)身上，而是綁定到了this.context上了。
(2)、live正是利用了事件委托機制來完成事件的監聽處理，把節點的處理委托給了document，新添加的元素不必再綁定一次監聽器。
(3)、使用live（）方法但卻隻能放在直接選擇的元素後面，不能在層級比較深，連綴的DOM周遊方法後面使用，即 ( “ u l ” " ) . l i v e . . . 可 以 ， 但 (“ul”").live...可以，但 (“ul”").live...可以，但(“body”).find(“ul”).live…不行；
執行個體如下：$( document ).on( “click”, “#members li a”, function( e ) {} );
（3），delegate
定義和用法：将監聽事件綁定在就近的父級元素上
文法：delegate(selector,type,[data],fn)
特點：
(1)、選擇就近的父級元素，因為事件可以更快的冒泡上去，能夠在第一時間進行處理。
(2)、更精确的小範圍使用事件代理，性能優于.live()。可以用在動态添加的元素上。
執行個體如下：
$("#info_table").delegate(“td”,“click”,function(){/顯示更多資訊/});
$(“table”).find("#info").delegate(“td”,“click”,function(){/顯示更多資訊/});
（4），on
定義和用法：将監聽事件綁定到指定元素上。
文法：on(type,[selector],[data],fn)
執行個體如下：$("#info_table").on(“click”,“td”,function(){/顯示更多資訊/});參數的位置寫法與delegate不一樣。
說明：on方法是目前JQuery推薦使用的事件綁定方法，附加隻運作一次就删除函數的方法是one()。
總結：.bind(), .live(), .delegate(), .on()分别對應的相反事件為：.unbind(),.die(), .undelegate(),.off()
43，浏覽器的核心分别是什麼？
IE：trident核心
Firefox：gecko核心
Safari：webkit核心
Opera：現在blink核心
Chrome：blink核心
44，浏覽器是如何渲染畫面的？
渲染的流程如下：
1， 解析HTML檔案，建立dom樹
自上而下，遇到任何樣式和腳本都會阻塞
2， 解析css。優先級：浏覽器預設設定<使用者設定<外部樣式<内聯樣式<HTML中的style樣式；
3， 将css和DOM合并，建構渲染樹
4， 布局和繪制，重繪和重排
45，css3新增了很多屬性，一起分析一下新增的屬性：
1.CSS3邊框：
· border-radius：CSS3圓角邊框。在 CSS2 中添加圓角矩形需要技巧，我們必須為每個圓角使用不同的圖檔，在 CSS3 中，建立圓角是非常容易的，在 CSS3 中，border-radius 屬性用于建立圓角。border：2px solid;
· box-shadow：CSS3邊框陰影。在 CSS3 中，box-shadow 用于向方框添加陰影。box-shadow:10px 10px 5px #888888;
· border-image：CSS3邊框圖檔。通過 CSS3 的 border-image 屬性，您可以使用圖檔來建立邊框。border-image：url(border.png) 30 30 round;
2.CSS3背景：
· background-size： 屬性規定背景圖檔的尺寸。在 CSS3 之前，背景圖檔的尺寸是由圖檔的實際尺寸決定的。在 CSS3 中，可以規定背景圖檔的尺寸，這就允許我們在不同的環境中重複使用背景圖檔。您能夠以像素或百分比規定尺寸。如果以百分比規定尺寸，那麼尺寸相對于父元素的寬度和高度。
· background-origin ：屬性規定背景圖檔的定位區域。背景圖檔可以放置于 content-box、padding-box 或 border-box 區域。
3.CSS3文字效果：
· text-shadow：在 CSS3 中，text-shadow 可向文本應用陰影。text-shadow:5px 5px 5px #FFFFFF;
· word-wrap :單詞太長的話就可能無法超出某個區域，允許對長單詞進行拆分，并換行到下一行：p{word-wrap:break-word;}
4.CSS3 2D轉換：
transform：通過 CSS3 轉換，我們能夠對元素進行移動、縮放、轉動、拉長或拉伸。
· translate()：元素從其目前位置移動，根據給定的 left（x 坐标） 和 top（y 坐标） 位置參數：transform：translate（50px,100px）;值 translate(50px,100px) 把元素從左側移動 50 像素，從頂端移動 100 像素。
· rotate()：元素順時針旋轉給定的角度。允許負值，元素将逆時針旋轉。transform:rotate(30deg);值 rotate(30deg) 把元素順時針旋轉 30 度。
· scale():元素的尺寸會增加或減少，根據給定的寬度（X 軸）和高度（Y 軸）參數：transform:scale(2,4);值 scale(2,4) 把寬度轉換為原始尺寸的 2 倍，把高度轉換為原始高x() 5.CSS3 3D轉換：
· rotateX()：元素圍繞其 X 軸以給定的度數進行旋轉。transform：rotateX(120deg);
· rotateY()：元素圍繞其 Y 軸以給定的度數進行旋轉。transform：rotateY(120deg);
6.CSS3 過渡：當元素從一種樣式變換為另一種樣式時為元素添加效果。
7.CSS3動畫：通過 CSS3，我們能夠建立動畫，這可以在許多網頁中取代動畫圖檔、Flash 動畫以及 JavaScript。
8.CSS3多列：
· column-count：屬性規定元素應該被分隔的列數。
· column-gap：屬性規定列之間的間隔。
· column-rule ：屬性設定列之間的寬度、樣式和顔色規則。
9.CSS3使用者界面：
· resize：屬性規定是否可由使用者調整元素尺寸。
· box-sizing：屬性允許您以确切的方式定義适應某個區域的具體内容。
· outline-offset ：屬性對輪廓進行偏移，并在超出邊框邊緣的位置繪制輪廓。
46，從輸入url到顯示頁面，都經曆了什麼？
1、首先，在浏覽器位址欄中輸入url
2、浏覽器先檢視浏覽器緩存-系統緩存-路由器緩存，如果緩存中有，會直接在螢幕中顯示頁面内容。若沒有，則跳到第三步操作。
3、在發送http請求前，需要域名解析(DNS解析)(DNS（域名系統，Domain Name System）是網際網路的一項核心服務，它作為可以将域名和IP位址互相映射的一個分布式資料庫，能夠使人更友善的通路網際網路，而不用去記住IP位址。)，解析擷取相應的IP位址。
4、浏覽器向伺服器發起tcp連接配接，與浏覽器建立tcp三次握手。（TCP即傳輸控制協定。TCP連接配接是網際網路連接配接協定集的一種。）
5、握手成功後，浏覽器向伺服器發送http請求，請求資料包。
6、伺服器處理收到的請求，将資料傳回至浏覽器
7、浏覽器收到HTTP響應
8、讀取頁面内容，浏覽器渲染，解析html源碼
9、生成Dom樹、解析css樣式、js互動
10、用戶端和伺服器互動
11、ajax查詢
47，對标簽有什麼了解？
Meta标簽提供關于html文檔的中繼資料。它不會顯示在頁面上，但是對于機器是可讀的。可用于浏覽器，搜尋引擎，或其他web服務。
作用：
Meta裡的資料是供機器解讀的，告訴機器如何解析這個頁面，還有一個用途是可以添加伺服器發送到浏覽器的http頭部内容。
48，h5新特性，
(1)新的語義标簽和屬性
(2)表單新特性
(3)視訊和音頻
(4)Canvas繪圖
(5)SVG繪圖
(6)地理定位
(7)拖放API
49，display：none 和 visibility：hidden的差別
1.display:none是徹底消失，不在文檔流中占位，浏覽器也不會解析該元素；visibility:hidden是視覺上消失了，可以了解為透明度為0的效果，在文檔流中占位，浏覽器會解析該元素；
2.使用visibility:hidden比display:none性能上要好，display:none切換顯示時visibility，頁面産生回流（當頁面中的一部分元素需要改變規模尺寸、布局、顯示隐藏等，頁面重新建構，此時就是回流。所有頁面第一次加載時需要産生一次回流），而visibility切換是否顯示時則不會引起回流。
50，JavaScript如何檢測一個變量是一個string類型
typeof(obj) === “string”
typeof obj === “string”
obj.constructor === String
**51， ( d o c u m e n t ) . r e a d y ( ) 方 法 和 W i n d o w . o n l o a d 有 什 麼 區 别 ？ ∗ ∗ ( 1 ) 、 w i n d o w . o n l o a d 方 法 是 在 網 頁 中 所 有 的 元 素 ( 包 括 元 素 的 所 有 關 聯 文 件 ) 完 全 加 載 到 浏 覽 器 後 才 執 行 的 。 ( 2 ) 、 (document).ready()方法和Window.onload有什麼差別？** (1)、window.onload方法是在網頁中所有的元素(包括元素的所有關聯檔案)完全加載到浏覽器後才執行的。 (2)、 (document).ready()方法和Window.onload有什麼差別？∗∗(1)、window.onload方法是在網頁中所有的元素(包括元素的所有關聯檔案)完全加載到浏覽器後才執行的。(2)、(document).ready() 方法可以在DOM載入就緒時就對其進行操縱，并調用執行綁定的函數。
52，get和post之間的差別？
1， 傳輸大小 get比post傳輸内容要小
2， Get請求參數會被保留在曆史記錄中，而post不會
3， Post是加密傳輸，get是明文傳輸，post要比get安全
4， Get隻能接受url編碼，而post沒有限制
![怎樣使用SpringMVC控制頁面[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)