總結

1. 講一下什麼是閉包，爲何內部函數B可使用A函數裏面的變量？

閉包：閉包是一個擁有許多變量和綁定了這些變量的環境表達式，一般是一個函數 ，所以這些變量也是該表達式的一部分；也就是說JS中全部的function都是一個 閉包，只是嵌套的function所產生的閉包更爲強大。

好處：1）建立一個匿名函數，並當即執行，因爲外部沒法引用內部變量，所以在 執行後能很快釋放，不會形成全局污染。

2）緩存，能夠將值存儲起來，當須要調用的時候，首先在緩存中查找，若是找不 到再進行計算，而後更新緩存並返回值。

3）實現封裝。

4）實現面向對象中的對象。

壞處：閉包會致使變量不能釋放，引發內存泄露。

1. 會用jQuery Mobile嗎？講一下他有哪些功能？事件？

使用data屬性驅動元素生成各類界面組件，我瞭解有觸摸事件，滑動事件，定位事件以及頁面事件。

 

1. css中的rem怎麼寫？他的做用是什麼？

rem爲元素設定字體大小時，仍然是相對大小，但相對的只是HTML根元素。

 

1. ajax運做原理？

1) ajax引擎(XMLHttpRequest)爲對象註冊一個監聽器(事件處理函數，對狀態的改變事件(readyStatechange)監聽)

2) 等待用戶執行操做(例如點擊)

3) 觸發了事件處理代碼

4) 調用ajax引擎

5) 發送請求，ajax引擎被調用後單獨向服務器發送請求(不是整個界面)——異步請求

6) 服務器接受到了處理請求--開始處理

7) 服務器將處理結果(xml或者文本)返回給了ajax引擎

8) 監聽相應數據

9) 監聽器對GUI數據更新

 

1. 對於jsonp有什麼瞭解

主要是用於解決ajax的跨域問題，利用在頁面中建立<script>節點的方法向不一樣域提交HTTP請求，請求完畢以後可使用callback方式回傳結果。

Jsonp缺點是隻支持get請求，只支持跨域http請求

 

1. jquery裏的bind,live,on的用法和區別？

用法：

bind(type,[data],fn) 爲每一個匹配元素的特定事件綁定事件處理函數；

live(type,[data],fn) 給全部匹配的元素附加一個事件處理函數，即便這個元素是之後再添加進來的

on(events,[selector],[data],fn) 在選擇元素上綁定一個或多個事件的事件處理函數

區別：

.bind()是直接綁定在元素上

.live()則是經過冒泡的方式來綁定到元素上的。更適合列表類型的，綁定到document DOM節點上。和.bind()的優點是支持動態數據。

.on()則是最新的1.9版本整合了以前的三種方式的新事件綁定機制

 

1. 盒模型是什麼？畫出每一個部分是從哪到哪?

CSS對HTML文檔元素生成了一個描述該元素在HTML文檔佈局中所佔空間的矩形元素框(element box),那麼咱們能夠形象地將其看做是一個盒子

由內到外：內容(content)、填充(padding)、邊框(border)、邊界(margin)， CSS盒子模式都具有這些屬性。

1. 說一下html5的本地存儲是什麼？

localStorage生命週期是永久，這意味着除非用戶顯示在瀏覽器提供的UI上清除localStorage信息，不然這些信息將永遠存在。

localStorage.setItem("key","value");//以「key」爲名稱存儲一個值「value」

localStorage.getItem("key");//獲取名稱爲「key」的值

枚舉localStorage的方法：

for(var i=0;i<localStorage.length;i++){

     var name = localStorage.key(i)​;

     var value = localStorage.getItem(name);​

}

刪除localStorage中存儲信息的方法：

localStorage.removeItem("key");//刪除名稱爲「key」的信息。

localStorage.clear();​//清空localStorage中全部信息

 

1. ajax的核心對象是什麼？

核心對象是XMLHttpRequest它能夠提供不從新加載頁面的狀況下更新網頁，在頁面加載後在客戶端向服務器請求數據，在頁面加載後在服務器端接受數據，在後臺向客戶端發送數據。

 

1. setInterval和setTimeout的區別。

setTimeout(表達式,延時時間)在執行時,是在載入後延遲指定時間後,去執行一次表達式

setInterval(表達式,交互時間)則不同,它從載入後,每隔指定的時間就執行一次表達式

 

1. 跨域問題的解決方案。

1.jsonp。

ajax請求，dataType爲jsonp。這種形式須要請求在服務端調整爲返回callback([json-object])的形式。若是服務端返回的是普通json對象。那麼調試的時候，在chrome瀏覽器的控制檯會報"Uncaught SyntaxError: Unexpected token"錯誤；在firefox瀏覽器的控制檯會報"SyntaxError: missing ; before statement"錯誤。

2.iframe跨域。

    頁面中增長一個iframe元素，在須要調用get請求的時候，將iframe的src設置爲get請求的url便可發起get請求的調用。

var url = "http://xxx.xxx.xxx";

$("#iframe").attr("src", url);//跨域，使用iframe

3.script元素的src屬性處理

iframe、img、style、script等元素的src屬性能夠直接向不一樣域請求資源，jsonp正是利用script標籤跨域請求資源的簡單實現，因此這個和jsonp本質同樣，一樣須要服務端請求返回callback...形式。

var url="http://xxx.xxx.xxx?p1=1";

var script = document.createElement('script');

script.setAttribute('src', url);

document.getElementsByTagName('head')[0].appendChild(script);

 

4.在服務器使用get處理。

對於業務上沒有硬性要求在前端處理的，能夠在服務端作一次封裝，再服務端發起調用，這樣就能夠解決跨域的問題。而後再根據請求是發出就完，仍是須要獲取返回值，來決定代碼使用同步或者異步模式。

private static void CreateGetHttpResponse(string url, int? timeout, string userAgent, CookieCollection cookies)

        {

            if (string.IsNullOrEmpty(url))

            {

                throw new ArgumentNullException("url");

            }

            var request = WebRequest.Create(url) as HttpWebRequest;

            request.Method = "GET";

            if (!string.IsNullOrEmpty(userAgent))

            {

                request.UserAgent = userAgent;

            }

            if (timeout.HasValue)

            {

                request.Timeout = timeout.Value;

            }

            if (cookies != null)

            {

                request.CookieContainer = new CookieContainer();

                request.CookieContainer.Add(cookies);

            }

            request.BeginGetResponse(null,null);//異步

            //return request.GetResponse() as HttpWebResponse;

        }

 

1. 選擇JQuery庫的緣由。

它是輕量級的js庫 ，它兼容CSS3，還兼容各類瀏覽器，使用戶能更方便地處理HTML（標準通用標記語言下的一個應用）、events、實現動畫效果，而且方便地爲網站提供AJAX交互。jQuery還有一個比較大的優點是，它的文檔說明很全，並且各類應用也說得很詳細，同時還有許多成熟的插件可供選擇。jQuery可以使用戶的html頁面保持代碼和html內容分離，也就是說，不用再在html裏面插入一堆js來調用命令了，只須要定義id便可。

1. 項目中bootstrap和angularJS在前端的主要方法和區別

bootstrap不算是javascript框架，它只是一個前端的ui框架，而後有一些附帶的js插件而已

angularjs是一個javascript的mvvm的框架，是爲了開發有複雜業務邏輯的CRUD（增）應用而生的。

 

1. html自帶的滾動標籤是什麼？html5引用多媒體的標籤是什麼？

<marquee></marquee>，<autio><video>。

 

1. 怎麼實現動畫效果的？

Javscript 動畫

css3 動畫：一種是 transition， 一種是 animation

html5 動畫：定義了三種繪圖的方式，canvas ,svg, webgl，其中svg作爲一種可縮放矢量圖形的實現是基於xml標籤訂義的，它有專門的 animate 標籤來定義動畫。而爲 canvas 或者 webgl 實現動畫則須要經過 requestAnimationFrame (簡稱 raf) 來按期刷新畫布。

 

1. 獲取文本框的值和設置？js和jq分別怎麼實現？

var obj=$("#文本框的id");

document.getElementById("#文本框的ID").value

 

1. 外部操做iframe內的元素？

經過window.top.document.getElementById("topNav")方法獲取了頂部菜單頁面（topPage.htm）所在的iframe對象；第二步，經過上一步獲取到的iframe對象的contentWindow屬性獲得了iframe中元素所在的window對象；第三步，經過上一步獲取到的window對象來操做iframe框架中的元素，這和操做不在iframe框架中的普通HTML元素是同樣的。

function ShowExit() {

             //獲取iframe的window對象

Var topWin = window.top.document.getElementById("topNav").contentWindow;

             //經過獲取到的window對象操做HTML元素，這和普通頁面同樣topWin.document.getElementById("exit").style.visibility = "visible";

         }　

 

1. 簡要描述position。

Absolute：生成絕對定位的元素，相對於 static 定位之外的第一個父元素進行定位。絕對定位是不佔位置的

Relative：生成相對定位的元素，相對於其正常位置進行定位，脫離了文檔流，原來所在的位置上偏移參照物，偏移後會把其它的層遮罩住。

Fixed：生成絕對定位的元素，相對於瀏覽器窗口進行定位。

 

1. CSS中before和after這兩個僞類選擇器。

selector:before( sRules ) 它要和content屬性一塊兒使用，設置在對象前（依據對象樹的邏輯結構）發生的內容；

selector:after( sRules ) 和before用法同樣，不過它是設置在對象後（依據對象樹的邏輯結構）發生的內容；

 

1. javascript的同步和異步。

javascript 異步表示async，指：代碼執行不按順序，‘跳過’執行，待其餘某些代碼執行完後，再來執行，稱爲「異步」。 

javascript同步表示sync，指：代碼依次執行。

 

1. link和import區別

二者都是外部引用CSS的方式。

區別1：link是XHTML標籤，除了加載CSS外，還能夠定義RSS等其餘事務；@import屬於CSS範疇，只能加載CSS。

區別2：link引用CSS時，在頁面載入時同時加載；@import須要頁面網頁徹底載入之後加載。

區別3：link是XHTML標籤，無兼容問題；@import是在CSS2.1提出的，低版本的瀏覽器不支持。

區別4：ink支持使用Javascript控制DOM去改變樣式；而@import不支持。

 

1. http的狀態碼

200 請求已成功，請求所但願的響應頭或數據體將隨此響應返回。

404 請求失敗，請求所但願獲得的資源未被在服務器上發現。

500 服務器遇到了一個不曾預料的情況，致使了它沒法完成對請求的處理。通常來講，這個問題都會在服務器的程序碼出錯時出現。

304：若是網頁自請求者上次請求後沒有更新，則用304代碼告訴搜索，引擎機器人，可節省帶寬和開銷

 

1. 行內元素和塊級元素

塊級元素：div  , p  , form,   ul,  li ,  ol, dl,    form,   address,  fieldset,  hr, menu,  table

行內元素：span,   strong,   em,  br,  img ,  input,  label,  select,  textarea,  cite,  

 

1. html5和css3的新特性

a) 新的內容標籤

b) 更好的表格體系

c) 音頻、視頻的API

d) Canvas API

e) 地理 API

f) 網頁存儲 API

CSS3新特性

a) 選擇器

b) RGBA和透明度

c) 多欄佈局

d) 多背景圖

e)  Word Wrap

f) 文字陰影

g) @font-face屬性

h) 圓角(邊框半徑)

i) 邊框圖片

j) 盒陰影

k) 盒子大小

l) 媒體查詢

m) 語音

 

1. 代碼你是怎麼優化的

減小Http請求

代碼位置優化

避免 CSS expressions

使用外部樣式/腳本

代碼/頁面壓縮

CSS代碼優化

JavaScript代碼優化

1. 簡述DIV元素和span元素的區別

SPAN 和 DIV 的區別在於，DIV(division)是一個塊級元素，能夠包含段落、標題、表格，乃至諸如章節、摘要和備註等。而SPAN 是行內元素，SPAN 的先後是不會換行的，它沒有結構的意義，純粹是應用樣式，當其餘行內元素都不合適時，可使用SPAN。

 

1. 對Web標準化（或網站重構）知道哪些相關知識，簡述幾條你知道的Web標準；

網頁主要由三部分組成：結構（Structure）、表現（Presentation）和行爲（Behavior）。對應的網站標準也分三方面：結構化標準語言，主要包括XHTML和XML；表現標準語言主要包括CSS；行爲標準主要包括對象模型（如W3C DOM）、ECMAScript等

 

1. 一個網站最多能夠用幾種顏色?

通常三到四種顏色，背景顏色、欄目顏色、字體顏色搭配起來要看着舒服，一般用同一色系的好一點。

 

1. 說幾條XHTML規範的內容:
   1. 全部的標記都必需要有一個相應的結束標記
   2. 全部標籤的元素和屬性的名字都必須使用小寫
   3. 全部的XML標記都必須合理嵌套
   4. 全部的屬性必須用引號""括起來
   5. 把全部<和&特殊符號用編碼表示
   6. 給全部屬性賦一個值
   7. 不要在註釋內容中使「--」

 

1. 結合<span id="outer"><span id="inner">text</span></span>這段結構，談談innerHTML、outerHTML、innerText之間的區別；

innerHTML：

document.getElementById("outer").innerHTML="Amount";//可包括htm標籤

結果<span id =" outer">Amount</span>

outerHTML：

var i =document.getElementById("outer").outerHTML;

結果：<span id =" inner">text</span>

outText：text

innerHTML:     <span>內容</span>，帶有html標籤

innerText:        內容 不帶html標籤

outerHTML:     <div><span>內容</span></div>

 

1. 談談javaScript數組方法sort()的使用，重點介紹sort()參數的使用及期內部機制；

sort() 方法用於對數組的元素進行排序。

語法: arrayObject.sort(sortby)

參數:sortby 可選。規定排序順序。必須是函數。

說明:若是調用該方法時沒有使用參數，將按字母順序對數組中的元素進行排序，說得更精確點，是按照字符編碼的順序進行排序。要實現這一點，首先應把數組的元素都轉換成字符串（若有必要），以便進行比較。

 

1. 字符串經常使用的操做方法。

substr 方法

返回一個從指定位置開始的指定長度的子字符串。

stringvar

必選項。要提取子字符串的字符串文字或 String 對象。

start

必選項。所需的子字符串的起始位置。字符串中的第一個字符的索引爲 0。

length

可選項。在返回的子字符串中應包括的字符個數。

 

1. DOM的操做，增刪等

一些經常使用的 HTML DOM 方法：

appendChild() 把新的子節點添加到指定節點。

removeChild() 刪除子節點。

replaceChild() 替換子節點。

insertBefore() 在指定的子節點前面插入新的子節點。

createAttribute() 建立屬性節點。

createElement() 建立元素節點。

createTextNode() 建立文本節點。

getAttribute() 返回指定的屬性值。

setAttribute() 把指定屬性設置或修改成指定的值。

 

1. Ajax的同步與異步的區別

同步須要等待返回結果才能繼續，異步沒必要等待，通常須要監聽異步的結果

同步是在一條直線上的隊列，異步不在一個隊列上 各走各的

 

1. Ajax返回值用什麼解析

JSON.parse：將"json"字符串(或不規則對象)轉成對應的對象或集合。

eval:將可執行的字符串轉js代碼並執行

 

1. 浮動產生邊距和display：inline產生邊距的兼容性問題怎麼處理?上下邊距怎麼處理？

 

1. 說說柵格系統怎麼回事

bootstrap3.x使用了四種柵格選項來造成柵格系統，這四種選項在官網上的介紹以下圖，不少人不理解，這裏跟你們詳解一下四種柵格選項之間的區別，其實區別只有一條就是適合不一樣尺寸的屏幕設備。咱們看class前綴這一項，咱們姑且之前綴命名這四種柵格選項，他們分別是col-xs、col-sm、col-md、col-lg，咱們懂英文的就知道，lg是large的縮寫，md是mid的縮寫，sm是small的縮寫，xs是***的縮寫。這樣命名就體現了這幾種class適應的屏幕寬度不一樣。

 

1. 說幾個過濾器？

<p>{{ 5.826 | number:2 }}</p>

咱們獲得的結果就是5.83(四捨五入的哦)

currency貨幣過濾器

{{ num | currency:'$' }}

date時間格式化過濾器

{{ today | date }}

 

1. 有一個select下拉列表，獲取選中選項的值，說說你的作法？

javascript原生的方法

  1:獲取select對象： var  myselect=document.getElementById("test");

2選中項的索引： var index=myselect.selectedIndex ; 

// selectedIndex表明的是你所選中項的index

3:拿到選中項options的value：  myselect.options[index].value;

4:拿到選中項options的text：  myselect.options[index].text;

jquery方法（前提是已經加載了jquery庫）

1:var options=$("#test option:selected");  //獲取選中的項

2:alert(options.val());   //拿到選中項的值

3:alert(options.text());   //拿到選中項的文本

 

1. 頁面拉到底，而後加載是怎麼實現的？

按需加載

生成<img data-src=」url」 style="word-wrap: break-word;">標籤時，用data-src來保存圖片地址；</img data-src=」url」>

記錄的圖片data-src都保存到數組裏；

對滾動條進行事件綁定,假設綁定的函數爲function lazyload(){};

在函數lazyload中，按照下面思路實現：計算圖片的Y座標，並計算可視區域的高度height，當Y小於等於(height+ scrollTop)時，圖片的src的值用data-src的來替換，從而來實現圖片的按需加載；

 

1. 什麼是事件冒泡？怎麼阻止事件冒泡

當一個元素上的事件被觸發的時候，好比說鼠標點擊了一個按鈕，一樣的事件將會在那個元素的全部祖先元素中被觸發。這一過程被稱爲事件冒泡；這個事件從原始元素開始一直冒泡到DOM樹的最上層。

當須要中止冒泡行爲時，可使用

function stopBubble(e) { 

//若是提供了事件對象，則這是一個非IE瀏覽器 

if ( e && e.stopPropagation ) 

    //所以它支持W3C的stopPropagation()方法 

    e.stopPropagation(); 

else 

    //不然，咱們須要使用IE的方式來取消事件冒泡 

window.event.cancelBubble = true; 

}

 

1. angularjs你通常用來作什麼？

數據的雙向綁定，異步請求

 

1. jq有哪些選擇器？用jq選擇div裏面直系img？用jq選擇div裏第一個img？

id選擇器，class選擇器，element選擇器，* 選擇器，並列選擇器，層次選擇器，過濾選擇器

$("#divName img").

$("#divName img").eq(0)

 

1. jq有哪些方法？

ready(fn)，bind(type,[data],fn), toggle(fn,fn)，Ajax()，insertBefore, insertAfter

 

1. 把abcdefg的efg去掉,

var str = "abcdefg";

var child = str.substr(0,3);//從下標爲0開始截取長度爲0的子串

 

1. anglerjs是怎麼樣實現頁面與數據庫中數據的雙向綁定的

咱們在html中先定義一個angular的app,指定一個angular的controller,則該controller會對應於一個做用域(能夠用$scope前綴來指定做用域中的屬性和方法等). 則在該ngCtl的做用域內的HTML標籤, 其值或者操做均可以經過$scope的方式跟js中的屬性和方法進行綁定.