原生一點面試題

   個人面試題：

 

 

1：javascript的數據類型有哪些：

 

答：字符串型，布爾型，number，null，underfind，數組，對象，fn，symbol;

 

2: 簡述一下javascript中的運算符有哪三類，分別包括什麼？

 

答：（１）算術運算符
　　JavaScript中的算術運算符有單目運算符和雙目運算符。
         雙目運算符：
         +（加） 、-（減）、 *（乘）、 /（除）、 %（取餘） 、|（按位或）、&(按位與)、<<（左      移）、 >>（右移）、

>       >>（右移，零填充）。
         單目運算符：
         -（取反）、~（取補）、++（遞加1）、--（遞減1）。

 

（2）比較運算符
　　比較運算符它的基本操做過程是，首先對它的操做數進行比較，爾後再返回一個true     或False值，有８個比較運算符
         <(小於)、>(大於)、<=(小於等於)、>=(大於等於)、==(等於)、!=(不等於)。

 

 

（3）布爾邏輯運算符
　　在JavaScript中增長了幾個布爾邏輯運算符:
         !（取反)、&=（與以後賦值）、 &（邏輯與）、 |=（或以後賦值）、 |（邏輯或）、 ^=     （異或以後賦值）、 ^（邏輯

異或）、 ?:（三目操做符）、||（或）、==(等於)、|=(不等於)。
　　其中三目操做符主要格式以下：
         操做數？結果１：結果２
　　若操做數的結果爲真，則表述式的結果爲結果１，不然爲結果２。

 

3:      javascript中2種變量範圍有什麼不一樣？

答：全局變量：當前頁面內有效

局部變量：方法內有效

 

4：js中的3種彈出式消息提醒（警告窗口，確認窗口，信息輸入窗口）的命令式什麼？

 

答：

alert
      confirm
      prompt

 

 

5：Ajax的原理是什麼？

答：Ajax的原理簡單來講經過XmlHttpRequest對象來向服務器發異步請求，從服務器得到數據，而後用javascript來操做DOM而更新頁面

 

6：body中的onload()函數和jQuery中的document.ready()有什麼區別？

答：onload()和document.ready()的區別有如下兩點：

1、咱們能夠在頁面中使用多個document.ready()，但只能使用一次onload()。

2、document.ready()函數在頁面DOM元素加載完之後就會被調用，而onload()函數則要在全部的關聯資源（包括圖像、音頻）加載完畢後纔會調用。

7：簡述一下javascript組成：

答：js組成：ECMAScript + BOM + DOM

8：程序的三大結構有哪些？

答：順序結構，選擇結構，循環結構；

9：函數的聲明方式有哪些？

答：函數聲明式，函數構造式， 函數構造法

10：簡述一下函數變量的生存週期？

答：

全局變量，當頁面關閉以後生存結束

局部變量，函數方法執行完畢以後生存週期結束

11：簡述一下js的執行流程？

答：

1：讀第一個代碼塊，作語法分析

2：若是過有語法錯誤，就跳出，若是有其餘代碼塊，就讀其餘代碼塊;

3：若是沒有錯誤，就對函數裏面的var，和function作預編譯處理

4:執行代碼塊，有錯就報錯；

5：若是後面還有代碼就按照上述執行，若是沒有就結束

 

12：簡述js中有哪幾種函數？

答：匿名函數，回調函數，遞歸函數，構造函數

13：請簡述嚴格模式是什麼？

Ecma5第二種運行模式，他的優勢有一下幾種：

1.消除一些javascript語法的一些不合理之處，減小一些怪異的行爲

2.消除一些代碼的不安全之處，提升代碼的安全性

3.提升代碼的運行效率，提升運行速度

4.爲將來的JavaScript打下鋪墊

 

14：Ecam5中新增的函數方法有哪些？

答：

Foreach( )，map( ), every( ),some( ) ,indexof( ), lastIndexof( ),filter( ),reduce(）

reduceRight( ),Array.isArray( );

15 : Ecma5中新增的字符串方法哪些？

答：

Trim()，，.myStr.charCodeAt(num),myStr.charAt(num)，

.myStr.replace(「需替換的字符串」,「替換後的字符串」),myStr.match()

myStr.slice(start,end),myStr.substring(start,end),substr(start,length)

 

substr(start,length),.toLowerCase(),.toUpperCase() ,split(),.myStr.search()共14種

 

16:簡述一下你所知道的math方法：

答：

Math.round(3.6);   // 四捨五入

Math.random();     // 返回大於等於0到小於1之間的隨機數。

Math.max(a, b);    // 返回較大的數值。

Math.min(a, b);    // 返回較小的數值。

Math.abs(num);     // 返回絕對值。

Math.ceil(3.6);    // 向上取整。

Math.floor(3.6);   // 向下取整。

Math.pow(x, y);    // x的y次方。

Math.sqrt(num);    // 開平方。

Math.sin(x);       // x的正弦值，返回值在-1到1之間。

Math.cos(x);       // x的餘弦值，返回值在-1到1之間。

共12種

 

17：如何建立日期對象？

答：

聲明一個變量等於 new Date（）；

 

 

 

18：簡述一下定時器和延時器的區別：

前者在指定時間後屢次執行；

後者在指定時間後只執行一次；

 

19：簡述一下bom的全稱：

答：Browser Object Model。

 

20：請簡述window有哪些屬性？

      答：

self：self表明本身，至關於window。

parent：返回父窗口。

top：返回頂層窗口，和parent做用同樣。

opener：窗口開啓者。

status：設置窗口狀態欄的文本。

 

21：請簡述一下window有哪寫事件？

onload：加載事件網頁加載完畢後執行。

onscroll：滾動事件。

onresize：窗口縮放事件。

// 獲取瀏覽器視窗寬度/高度

document.documentElement.clientWidth;

document.documentElement.clientHeihgt;

 

22：簡述一下你知道的window的方法有哪些？

答：

Window.open

Window.close,

Window.alert,

Window.comfirm

window.prompt

22 : 簡述一下history的屬性哪些？

答：length

 

23：簡述一下history有哪些方法？

答：

Back( ),forword( ),go( );

 

24:簡述一下dom的做用和概念？

答：

DOM：Document Object Model。

document對象是DOM核心對象。

做用：對html中的內容，屬性，樣式進行操做。

25：在js中獲取或者的輸入dom節點的方法有哪些？

答：

getElementById(id)

getElementsByTagName(tagName)

getElementsByName(name)

getElementsByClassName()

 

26：在js中，如何操控dom節點中的內容，操控的方法有哪些？

答：

innerHTML

innerText

outerHTML

outerText

textContent

27：在js中如何操控dom節點的屬性？

答：

 getAttribute(「屬性」)。                 // 獲取給定的屬性的值。

   setAttribute(「屬性」,「值」)。 // 設置或是添加屬性。

removeAttribute(「屬性」)。            // 刪除屬性。

 

 

 

28：在js中如何操控dom節點的樣式？

答：

獲取樣式：Dom對象.style.屬性；

設置樣式：Dom對象.style.屬性=「」屬性值「’；

 

29：在js中，如何給dom節點增長一個屬性，並賦值？

答：

Dom對象.屬性=屬性值；

 

30：那麼，在js中，如何建立一個dom節點，並追加到父元素中？

答 ：

Var newNode= document.createElement("元素標籤名");

父元素.appendChild(newNode) ；

 

31:簡述一下，js中如何控制表格？

答：

table.tBodies[0].rows[0].cells[0].innerHTML;

var oNewRow = table.insertRow(「行位置」);

oNewRow.insertCell(「列位置」);

 

 

 

32：簡述一下，js中如何操控父節點的子節點？

答：

對象.parentNode 得到父節點的引用。

對象.childNodes 得到子節點的集合，包括空白節點。

IE7/8不包含空文本節點，但IE7包含首個註釋節點（前

面沒有元素節點），IE8包含全部的註釋節點。

對象.children    得到子節點的集合，不包含空白節點。但IE7包含首個註釋              節點（前面沒有元素節點），IE8包含全部的註釋節點。（僅僅是子節點）

對象.firstChild 得到第一個子節點。（IE7/8非空白節點，多是註釋節點）

對象.firstElementChild 得到第一個非空白的子節點。（IE7/8不支持）

對象.lastChild   得到最後一個子節點。（IE7最後一個元素節點，IE8最後一個非空白節點，多是註釋節點）

對象.lastElementChild   得到最後一個非空白的子節點。（IE7/8不支持）

對象.nextSibling 得到下個兄弟節點的引用。 （包括空白節點和註釋。IE7/8包括註釋節點，不包括空白節點。）

對象.nextElementSibling 得到下個兄弟節點的引用。 （IE7/8不支持）

對象.previousSibling 得到上個兄弟節點的引用。（包括空白節點和註釋。 IE7/8包括註釋節點，不包括空白節點。）

 

 

 

 

33：表單元素有哪些共同的屬性和方法？

答：

一：獲取表單元素的值

表單元素對象.value   // 獲取或是設置值

二：屬性

disabled   // 獲取或設置表單控件是否禁用 true false

form       // 指向包含本元素的表單的引用。(經過表單中元素找                                                                              到相應的表單)

三：方法   表單元素是否得到焦點

blur()   // 失去焦點

focus() // 得到焦點

 

34：js中表單驗證是會涉及到哪些事件？

答：

onsubmit 當表單提交的時候觸發的事件。

onblur    失去焦點。

onfocus   得到焦點。

0nchange 下拉框改變值的時候。

 

 

 

 

 

35：簡述一下你是所知道的事件有哪些類別，分別是什麼？

答：鼠標事件，鍵盤事件，頁面事件，表單事件

 

36：簡述一下你知道的表單事件？

答：

onsubmit    提交

onblur      得到焦點

onfocus     失去焦點

onchange    改變文本區域的內容

 

37：簡述一下什麼是綁定事件？

答：

將一個具體的事件綁定到某個元素上，在該元素髮生變更，或者觸發某種變化時，執行該事件，就稱做綁定事件；

 

38：如何在同一個元素上綁定多個事件？要用到哪一個方法，有沒有兼容問題？

答：

IE：（多個函數執行順序：IE9/10按照綁定的順序執行，IE7/8順序相反。）

對象.attachEvent("事件(on)","處理程序") 添加

對象.detachEvent("事件(on)","處理程序") 刪除

 

火狐：（多個函數執行順序：按照綁定的順序執行。）

對象.addEventListener("事件"(不加on),"處理程序",、

布爾值)添加

對象.removeEventListener("事件"(不加on),"處理程序",布爾值) 刪除

 

39：什麼是事件對象？他有哪些特徵？

答：

用來記錄一些事件發生時的相關信息的對象。

特徵：

1.只有當事件發生的時候才產生，只能在處理函數內部訪問。

2.處理函數運行結束後自動銷燬。

 

40：簡述一下什麼是事件流？

答：

當頁面元素觸發事件的時候，該元素的容器以及整個頁面都會按照特定順序響應該元素的觸發事件，事件傳播的順序叫作事件流程。

 

 

41：什麼是僞數組？僞數組須要知足哪些條件？

答：

1.具備length屬性

2.按索引值存儲數據

3.不具備數組的pop,push等方法；

42：如何將你建立的dom節點插入到指定的位置？

答：

    1.父對象.appendChild(newNode) // 插入到父對象最後。(若是子元素沒有父          元素，就講body設置成父元素，可是若是要調用，前面必須加上document進             行調用)

    2.父對象.insertBefore(newNode, existsNode)   // 插入到什麼對象以前。

43：如何刪除某個節點？

答:

   父對象.removeChild(oldNode);

            若是肯定要刪除節點，最好也清空內存 對象=null;

 

44 : dom常見的能夠設置或者讀取的屬性有哪些？

答：

1：offsetParent：獲取元素的最近的具備定位屬性（absolute或者relative）的父級        元素。若是都沒有則返回body。

2：offsetLeft：獲取元素相對具備定位屬性的父級元素的左側偏移距離。（子元素的            marginLeft + left + 父元素的paddingLeft）

3：offsetTop：獲取元素相對就有定位屬性的父級元素的頂部偏移距離。（子元素的            marginTop + top + 父元素的paddingTop）

4：scrollLeft/scrollTop：滾動條最頂端和窗口中可見內容的最頂端之間的距離。

6：clientWidth/clientHeight：元素視窗寬度/高度

5：offsetWidth/offsetHeight：元素實際寬度/高度。

6：scrollWidth/scrollHeight：獲取對象的滾動寬度/高度。

 

45：簡述一下鼠標事件中的，屬性pageX,clientX,offsetX,screenX四者的區別？

答：

clientX： 當鼠標事件發生的時候，鼠標相對於瀏覽器X軸的位置。

pageX：   當鼠標事件發生的時候，鼠標相對於文檔X軸的位置。（IE7/8無）

screenX:   當鼠標事件發生的時候，鼠標相對於屏幕X軸的位置。

offsetX : 當鼠標事件發生的時候，鼠標相對於事件源X軸的位置。

 

46：事件流有那兩類？

答：

1.冒泡事件

2.捕獲型事件

47：簡述一下你對冒泡事件和捕獲型事件的理解？

答：

冒泡事件是有明確事件到不明確事件，

捕獲型事件是由不明確到明確事件

 

 

 

 

48.事件流的執行順序是怎麼樣的？

答：

當元素即綁定捕獲型事件又綁定冒泡型事件執行順序：先捕獲後冒泡。

若是該元素是目標事件源對象，則誰綁定在前就先執行誰。

49.什麼是事件委託？通常用在哪？

答：利用冒泡機制，將子元素事件委託給父輩元素執行。通常用由js建立的新的dom節點添加事件時候；

 

50.什麼是異步，簡述一下你對異步的理解？

答：

在接受數據時，沒有必要等到數據接受完在進行其餘操做，簡單來講就像你你在看電影，還能夠吃爆米花；

同步就是高考時候，監考老師說，你必須交完卷子，才能上廁所；

 

51：簡述一下，ajax如何去取數據，有哪四步？

答：

建立對象，

Open（）；//打開

Send( );//發送

等待接受數據；

 

 

 

52：解釋一下json和jsonp？、

答：

Json是一種數據存儲的方式；

Jsonp是就接口兩個能夠說是徹底不同的東西

53：解釋一下你對先後端分離的理解？

答：

後臺只管數據輸出和業務邏輯處理，前端負責交互邏輯和界面展現。簡單的說：    前端靜態頁面中沒有有後臺程序代碼，後臺輸出不帶有HTML標籤的數據。

 

54：簡述一下promise函數？是什麼，幹什麼的，怎麼樣？

答：

是一個構造函數,它其實是對回調函數的一種封裝 對異步編程的一種改進

Promise構造函數接受一個函數做爲參數，該函數的兩個參數分別是resolve 和reject。它們是兩個函數，由JavaScript引擎提供，不用本身部署。經過      這兩個函數能夠能夠執行某個事件成功或者失敗時的回調函數

更方便，邏輯也更加清晰；

55：簡述一下什麼是同源策略，爲何要有同源策略？

答：所謂同源：是指協議、域名、端口都相同。

目的：保證用戶信息的安全，防止惡意的網站竊取數據。

 

 

 

56：若是要解決同源策略，如何跨域取數據？

答：

經過jsonp進行跨域取數據；

1：定義一個回調函數。

2：建立script標籤，指定src地址，並添加到頁面中。

注：src必須跟着一個參數callback來指定回調函數名稱。

 

57：簡述一下get和post提交數據的兩種方式有什麼區別？

答：

get多用於從服務器上獲取數據，post多用於向服務器發送數據。

2：數據提交

GET請求的數據會附在URL以後（就是把數據放置在HTTP協議頭中），以? 分割URL和傳輸數據，參數之間以&相連。POST把提交的數據則放置在是HTTP 包的包體中。

3：數據大小

GET請求傳送的數據量比較小，達能大於2KB，這個受瀏覽器的限制。而POST    請求傳送的數據量比較大，通常默認爲不受限制。其實大小受服務器的限制。

4：安全性

GET安全性很是低，POST的安全性較高

 

 

 

58：簡述一下http協議是什麼？幹什麼吃的？怎麼樣？

答：

超文本傳輸協議（HTTP，HyperText Transfer Protocol）是互聯網上應用最爲普遍的一種網絡協議。全部的WWW文件都必須遵照這個標準。該協議用於從WWW服務器傳輸超文本到本地瀏覽器的傳輸協議。它可使瀏覽器更加高效，使網絡傳輸減小。它不只保證計算機正確快速地傳輸超文本文檔，還肯定傳輸文檔中的哪一部分，以及哪部份內容首先顯示(如文本先於圖形)等。

 

59：什麼是cookie？

答：指某些網站爲了辨別用戶身份，進行session（會話）跟蹤而存儲在用戶本地終端上的數據（一般通過加密）。以文本形式存在。

他減小了服務器請求的壓力，同時優化了用戶的操做

 

60：cookie的特色有哪些？

答：

時效性：可自定存儲時間；

大小：通常4k左右

只能用文本文件；

讀取有域名限制；

通常瀏覽器存儲cookie的上限是在50個左右

 

61：在js中如何讀取和存儲cookie？

答：

添加cookie：document.cookie = 「key=value」; // 一次寫入一個鍵值對

讀取cookie：document.cookie;

62：什麼是跨站腳本個攻擊？

答：

跨站腳本攻擊(Cross Site Scripting)，爲不和層疊樣式表(Cascading Style Sheets, CSS)的縮寫混淆，故將跨站腳本攻擊縮寫爲XSS。惡意攻擊者往Web頁面裏插入惡意Script代碼，當用戶瀏覽該頁之時，嵌入其中Web裏面的Script代碼會被執行，從而達到惡意攻擊用戶的目的。

跨站腳本攻擊的核心在於腳本的成功注入，並二次展現。一般服務器端都會對文本內容進行安全性的過濾。

 

63：什麼是正則，爲何要使用他，如何使用

答：

正則表達式(regular expression)是一個描述字符規則的對象。能夠用來檢查一個字符串是否含有某個子字符串，將匹配的子字符串作替換或者從某個字符串中取出符合某個條件的子串等。

 

前端每每有大量的表單數據校驗工做，採用正則表達式會使得數據校驗的工做量大大減輕。經常使用效果：郵箱、手機號、身份證號等。

 

第一種方式：

var reg = new RegExp(「study」， 「ig」);   // 第二個參數爲修飾符

i：表示忽略大小寫。

g：表示全局匹配，查找全部匹配而非在找到第一個匹配後中止。

m：多行匹配。

第二種方式：

var reg = /study/ig

64：簡述一下js中有哪寫聲明變量的方式？

答：var，let，const

65:簡述你對暫時性死區的理解？

答：

暫時性死區的本質就是，只要一進入當前做用域，所要使用的變量就已經存在了，可是不可獲取，只有等到聲明變量的那一行代碼出現，才能夠獲取和使用該變量。

 

66：什麼是變量的解構？

答：

ES6容許按照必定模式，從數組和對象中提取值，對變量進行賦值，這被稱爲解構（Destructuring）。

67：ES6中新增的字符串方法有那哪些

答：

includes()、startsWith()、endsWith()，repeat()

 

68：什麼是模板字符串，它是用來幹什麼的？

答：

模板字符串（template string）是加強版的字符串，用反引號（`）標識。它能夠看成普通字符串使用，也能夠用來定義多行字符串，或者在字符串中嵌入變量。模板字符串中嵌入變量，須要將變量名寫在${}之中。

69：es6對數字進行處理，增長哪些方法？

答：

Number.isNaN()   用來檢查一個值是否爲NaN

Number.parseInt()、取整

Number.parseFloat()：取小數

 

70：es6新增的math函數有哪些，試舉例說明？

答：

Math.trunc()：用於去除一個數的小數部分，返回整數部分。

Math.sign()：用來判斷一個數究竟是正數、負數、仍是零。

Math.cbrt()：用於計算一個數的立方根。

Math.hypot()：返回全部參數的平方和的平方根。

71：es6中對數組擴展哪些行的用法？

答：

Array.of()：用於將一組值，轉換爲數組。

Array.from()：用於將兩類對象轉爲真正的數組：相似數組的對象（array-like object）和可遍歷（iterable）的對象。

數組實例的copyWithin()：在當前數組內部，將指定位置的成員複製到其餘位置（會覆蓋原有成員），而後返回當前數組。也就是說，使用這個方法，會修改當前數組。

 

數組實例的find()和findIndex()：

數組實例的find方法，用於找出第一個符合條件的數組成員。它的參數是一個回 調函數，全部數組成員依次執行該回調函數，直到找出第一個返回值爲true的成      員，而後返回該成員。若是沒有符合條件的成員，則返回undefined。

 

72：es6中使用箭頭函數須要注意哪些？

答：

1：函數體內的this對象，就是定義時所在的對象，而不是使用時所在的對象。

2：不能夠看成構造函數，也就是說，不可使用new命令，不然會拋出一個錯誤。

3：不可使用arguments對象，該對象在函數體內不存在。若是要用，能夠用Rest參數代替。

4：不可使用yield命令，所以箭頭函數不能用做Generator函數。

上面四點中，第一點尤爲值得注意。this對象的指向是可變的，可是在箭頭函數中，它是固定的。

73：簡述一下什麼是閉包？

答：

閉包就是可以讀取其餘函數內部變量的函數。在JS中，只有函數內部的子函數才能讀取局部變量，所以能夠把閉包簡單理解爲」定義在一個函數內部的函數」。

 

 

 

74：閉包有哪些特色？

答：

1：能夠讀取函數內部的變量。

2：讓這些變量的值始終保存在內存中。

75：閉包的原理是什麼？

答：

理解閉包，首先必須理解JS變量的做用域。變量的做用域無非就是兩種：全局變量和局部變量。

JS語言的特殊之處，就在於函數內部能夠直接讀取全局變量。另外一方面，函數外部天然沒法讀取函數內的局部變量。

 

 76:簡述一下你對prototype的概念的理解，能夠分爲那哪幾個概念的理解？

答：

1：一切引用類型都是對象。

2：對象是屬性的集合。

3：對象都是經過函數建立的。

4：每一個函數都有一個prototype屬性，即原型。對象都有__proto__屬性，能夠成爲隱式原型。這個__proto__屬性是一個隱藏的屬性，JS並不但願開發者可以用到這個屬性，有的低版本瀏覽器甚至不支持這個屬性值。

5：每一個對象的__proto__屬性指向建立該對象的函數的prototype。

6：Object.prototype.__proto__指向null。

 

 

77：js中設計模式有多少種？簡單的據幾個例子？

答：23種

單例模式，代理模式，適配器模式，觀察者模式，簡單工廠，抽象工廠

78：簡述一下Sass是用來幹嗎的？

答：

CSS 不是編程語言，雖然能夠用它來開發網頁樣式，可是沒有辦法用它編程。SASS 的出現，讓 CSS 實現了經過代碼編程的方式來實現。

SASS 是一種 CSS 預處理器，提供了許多便利的寫法，讓 CSS 的處理實現了可編程處理。

SASS 擴展了 CSS3，增長了規則、變量、混入、選擇器、繼承等特性， 能夠生成風格良好的 CSS 樣式表文件，易於組織和維護。

79：簡述一下gulp是用來幹嗎的？

答：

1：自動壓縮JS文件。

2：自動壓縮CSS文件

3：自動合併文件。

4：自動編譯sass。

5：自動壓縮圖片。

6：自動刷新瀏覽器。

等等。

 

 

80:簡述一jQuery是什麼？怎麼樣？

答：是類庫：

怎麼樣：

1：體積小，使用靈巧（只需引入一個js文件）。

2：方便的選擇頁面元素（模仿CSS選擇器更精確、靈活）。

3：動態更改頁面樣式/頁面內容（操做DOM，動態添加、移除樣式）。

4：控制響應事件（動態添加響應事件）。

5：提供基本網頁特效（提供已封裝的網頁特效方法）。

6：快速實現通訊（ajax）。

7：易擴展、插件豐富。

8：支持鏈式寫法。

81：IE6雙邊距bug:

 塊屬性標籤添加了浮動float以後，若在浮動方向上也有margin值，則margin值會加倍。其實這種問題主要就是會把某些元素擠到了第二行

解決方法：

給float元素添加display：inline 便可正常顯示

82：在某些瀏覽器中，標籤屬性min-height是不兼容的

解決方法：

可使用css表達式進行賦值

 

83：如何解決png24位在IE6下面會出現背景？

解決辦法：

使用png8格式來替代

84：IE6下div高度沒法小於10px

解決辦法：

添加overflow屬性或設置fontsize大小爲高度大小 

85：ie6下的圖片被拉高

解決辦法：

h1{font-size:1em;}設置裏面的字體大小爲一個定數

86：在mozilla firefox和IE中的BOX模型解釋不一致致使相差2px

解決方法：

div{margin:30px!important;margin:28px;}

87：.form在IE6裏面底下會多出來一行？

解決辦法：

加上：style="padding:0; margin:0

88： 文字和圖片在同一行垂直居中問題：

解決辦法：

一個關鍵的屬性: margin-bottom 經過修改圖片的外邊框的底部高度就可讓文字移動上來. 作法是把這個值設置爲負數.例如咱們把下面的16X15的圖片設置它的style="margin-bottom:-3px" 這樣文字和圖片就居中了

89：.圖片透明兼容寫法

解決辦法：

filter:alpha(opacity=70);-moz-opacity:0.7;

 

 

90：IE行內元素上下margin及padding不拉開元素間距的問題

解決辦法：

將行內元素display設置爲block便可解決

91：dt中圖片間隙（IE6）

如何解決：   

hack: 將<img>轉爲塊狀元素，給<img>添加聲明：display:block;

92： li中圖片間隙

hack1:img轉爲塊元素；

hack2:給ul設置font-size:0；

hack3:給img設置margin-bottom:-3px;

93：表單元素行高不一致(IE,MOZ,C,O,S)

描述：表單元素行高對齊方式不一致

hack:給表單元素添加聲明：float:left;

94：按鈕元素默認大小不一

描述：各瀏覽器中按鈕元素大小不一致

hack1： 統一大小/（用a標記模擬）

hack2：在input上寫按鈕的樣式，必定要把input的邊框去掉。

hack3：若是這個按鈕是一個圖片，直接把圖片做爲按鈕的背景圖便可。

94:li裏a加display：block；出現行高不一致

hack1：給a加display：inline-block；

hack2：給a加display：inline;

 

95:在IE中，能夠利用eval_r(‘元素ID屬性值’)的方法取得改HTML對象，FireFox不支持此種對象

解決辦法：

用「document.getElementByIdx_xx(‘元素ID屬性值’)」的方法取得對象；

96:.集合類對象的()與[]的問題：之前的代碼中不少集合類對象的訪問使用()，IE能夠正常解析，FireFox不支持

 

解決辦法：改 用[]做爲下標符號。 如：document.Forms(‘FormName’)改成document.Forms[‘FormName’]；又 如：document.getElementsByName(‘元素Name屬性值’)(1)改成 document.getElementsByName(‘元素Name屬性值’)[1]；

 

97：.IE或者FireFox2.0.x下,可使用window.location或window.location.href;但在FireFox1.5下，只能使用window.location

解決辦法：

解決方法:使用window.location來代替window.location.href

 

98：FireFox不支持元素的innerText屬性，需用textContent

解決辦法：
       if(navigator.appName.indexOf("Explorer") > -1){
           document.getElementByIdx_xx('element').innerText = "my text";
       } else{
    document.getElementByIdx_xx('element').textContent = "my text";
}

 

99：在訪問某一節點如childNodes[i]時，要得到該節點的值而這個值是<![CDATA[]]類型，那麼在IE中可支持這樣訪問 childNodes[i].text或childNodes[i].firstChild.nodeValue；在FireFox只支持 childNodes[i].firstChild.nodeValue

解決辦法：統一用childNodes[i].firstChild.nodeValue方法訪問節點元素值

 

100：在FireFox中，本身定義的屬性必須用getAttribute()方法獲取，不能像在IE下直接獲取

解決辦法：統一用getAttribute()方法獲取

 

101:jquery中如何設置某個dom節點屬性和屬性值？

答：

attr(name|properties|key,value|fn)：設置或返回被選元素的      屬性     值。

removeAttr(name)：從每個匹配的元素中刪除一個屬性。

prop(name|properties|key,value|fn)：獲取在匹配的元素集 中的第       一個元素的屬性值。

removeProp(name)：用來刪除由.prop()方法設置的屬性集。

102：jquery中如何操控dom的class屬性？

答：

addClass(class|fn)：爲每一個匹配的元素添加指定的類名。

removeClass([class|fn]) ：從全部匹配的元素中刪除所有或JQtoggleClass(class|fn[,switch])：若是存在（不存在）就刪除     （添加）一個類。

103：如何過去dom節點中的值？

答：

html([val|fn])：取得第一個匹配元素的html內容。這個函數不能用於XML文檔。但能夠用於XHTML文檔。

text([val|fn])：取得全部匹配元素的內容。結果是由全部匹配元素包含的文本內容組合起來的文本。這個方法對HTML和XML文檔都有效。

val([val|fn|arr])：得到匹配元素的當前值。若是多選，將返回一個數組，其包含所選的值。

104：jquery中的綁定事件有哪些？

答：

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

off(events,[selector],[fn])：在選擇元素上移除一個或多個事件的事件處理函數。

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

unbind(type,[data|fn]])：bind()的反向操做，從每個匹配的元素中刪除綁定的事件。若是沒有參數，則刪除全部綁定的事件。

one(type,[data],fn)：爲每個匹配元素的特定事件（像click）綁定一個一次性的事件處理函數。

hover([over,]out)：當鼠標移動到一個匹配的元素上面時，會觸發指定的第一個函數。當鼠標移出這個元素時，會觸發指定的第二個函數。

click([[data],fn])：觸發每個匹配元素的click事件。這個函數會調用執行綁定到click事件的全部函數。

 

105：在jquery中如何獲取數據你？

答：

load(url, [data], [callback])：載入服務器HTML文件代碼並插入至DOM中。

jQuery.ajax(url, [settings])：經過HTTP請求加載遠程數據，返回其建立的XHR對象。

$.get(url, [data], [callback], [type])：經過HTTP GET請求獲取數據。這是一個簡單的GET請求取代複雜的$.ajax。請求成功時可調用回調函數。若是須要在出錯時執行函數，則使用$.ajax。

type值：_default。HTML或者XML取決於返回值。

$.post(url, [data], [callback], [type])：經過HTTP POST請求獲取數據。這是一個簡單的POST請求取代複雜的$.ajax。請求成功時可調用回調函數。若是須要在出錯時執行函數，則使用$.ajax。

type值：_default。HTML或者XML取決於返回值。

$.getJSON(url, [data], [callback])：經過HTTP GET請求獲取JSON數據。能夠經過使用JSONP形式的回調函數來加載其餘網站的數據。如：」myulr?cb=?」，jQuery會自動替換 ? 爲正確的函數名，以執行回調函數。

$.getScript(url, [callback])：經過HTTP GET請求載入並執行一個JS文件。

$(DOM).serialize()：序列表單內容爲字符串，用於AJAX請求。

$(DOM).serializeArray()：序列化表單元素，返回JSON數據結構數據。

 

106：jquery中如何進行對象的訪問？

答：

each(callback)：以每個匹配的元素做爲上下文來執行一個函數。回調函數有兩個參數，第一個參數表明索引，第二個參數表明當前遍歷到的DOM對象。return true則跳至下一個循環(就像在普通循環中使用continue)，return false則終止循環（就像在普通循環中使用break）。

size()： jQuery 對象中元素的個數。

get([index])：取得其中一個匹配的元素。 num表示取得第幾個匹配的元素。與$(this)[0]等價。

index([selector|element])：搜索匹配的元素，並返回相應元素的索引值，從0開始計數。若是參數是一組DOM元素或者jQuery對象，那麼返回值就是傳遞的元素相對於原先集合的位置。若是不傳遞參數，那麼返回值就是這個jQuery對象集合中第一個元素相對於其同輩元素的位置。

數據緩存：

data([key],[value]) ：在元素上存放數據,返回jQuery對象。

removeData([name|list])：在元素上移除存放的數據。

多庫共存：

jQuery.noConflict()：運行這個函數將變量$的控制權讓渡給第一個實現它的那個庫。

 

107：jquery有哪些工具函數？

答：jQuery.each(object, [callback])：通用例遍方法，可用於例遍對象和數組。此方法可用於例遍任何對象。回調函數擁有兩個參數：第一個爲對象的成員或數組的索引，第二個爲對應變量或內容。

jQuery.grep(array, callback, [invert])：使用過濾函數過濾數組元素。此函數至少傳遞兩個參數：待過濾數組和過濾函數。過濾函數必須返回 true 以保留元素或 false 以刪除元素。若是 "invert" 爲 false 或爲設置，則函數返回數組中由過濾函數返回 true 的元素，當"invert" 爲 true，則返回過濾函數中返回 false 的元素集。

jQuery.map(arr|obj,callback)：將一個數組中的元素轉換到另外一個數組中。

jQuery.inArray(value,array,[fromIndex])：肯定第一個參數在數組中的位置，從0開始計數(若是沒有找到則返回 -1 )。

jQuery.toArray()：把jQuery集合中全部DOM元素恢復成一個數組。

jQuery.merge(first,second)：合併兩個數組。

jQuery.unique(array)：刪除數組中重複元素。只處理刪除DOM元素數組，而不能處理字符串或者數字數組。

jQuery.parseJSON(json)：接受一個JSON字符串，返回解析後的對象。傳入一個畸形的JSON字符串會拋出一個異常。

jQuery.trim(str)：去掉字符串起始和結尾的空格。

jQuery.contains(container,contained)：一個DOM節點是否包含另外一個DOM節點。

jQuery.type(obj)：檢測obj的數據類型。

jQuery.isArray(obj)：測試對象是否爲數組。

jQuery.isFunction(obj)：測試對象是否爲函數。

108:簡述一下git和svn的區別？

答：

git 是分佈式的，svn 不是。

git 按照元數據的方式存儲內容，svn 是按照文件的形式存 儲

git 和 svn 中的分支不一樣。

git 沒有全局版本號，svn 有。

git 內容的完整性優於 svn。

109：爲何要使用webpack？

答：

webpack是一個前端工具，可讓各個模塊進行加載、預處理，再進行打包。它能有grunt或gulp的全部基本功能。優勢以下：

1：支持commonJS和AMD模塊。

2：支持不少模塊加載器的調用，可使模塊加載器靈活定製，好比babel-loader加載器，該加載器能使咱們使用ES6的語法來編寫代碼。

3：能夠經過配置打包成多個文件，有效地利用瀏覽器的緩存功能提高性能。

4：使用模塊加載器，能夠支持sass、less等處理器進行打包且支持靜態資源樣式及圖片進行打包。

 

110.：angular.js 和jq的區別？

答：

前者是框架，後者是類庫

111：簡述一下，你所瞭解的mvvm框架？

答：

View：它專一於界面的顯示和渲染，在angularJS中則是包含一堆聲明式Directive的視圖模板。

ViewModel：angular中的$scope對象充當了這個ViewModel的角色。它是View和Model的粘合體，負責View和Model的交互協做，它負責給View提供顯示的數據，以及提供了View中事件操做Model的途徑。

Model：它是與應用程序的業務邏輯相關的數據的封裝載體，它是業務領域的對象，Model並不關心會被如何顯示或操做，因此模型也不會包含任何界面顯示相關的邏輯。在web頁面中，大部分Model都是來自於AJAX的服務器返回數據或者是全局的配置對象，而angular中的service則是封裝和處理這些與Model相關的業務邏輯的場所。這類的業務服務是能夠被多個Controller或者其餘service複用的領域服務。

Controller：這並非MVVM模式的核心元素，但它負責ViewModel對象的初始化，它將組合一個或者多個service來獲取業務領域Model放在ViewModel對象上，使得應用界面在啓動加載時達到可用的狀態。

也能夠稱它爲MVC模式，由於ViewModel在C裏面。

 

112：判斷一個數據是數組的方法有哪寫？

答：

isArray(); instanceof,object.prototype,toString等等。。。。