1. 程式人生 > >面試題 ------ 前端部分

面試題 ------ 前端部分

1、簡單所以下html,css,javascript 在網頁開發中的定位?

HTML 超文字標記語言 定義網頁的結構
CSS 層疊樣式表,用來美化頁面
JavaScript 主要用來驗證表單,做動態互動(其中 ajax)

2、簡單介紹下ajax?

什麼是ajax?
    非同步的javascript 和 xml
作用是什麼?
    通過AJAX 與伺服器進行資料交換,AJAX 可以使用網頁實現佈局更新,這意味著可以不重新載入整個頁面的情況下,對網頁的某個部分進行更新.
怎麼來實現 Ajax?
    XxmlHttpRequest 物件,使用這個物件可以一步向伺服器傳送請求,獲取響應,完成區域性更新。Open send responseText/responseXML 區域性響應
使用場景?
    登陸失敗時不跳轉頁面,註冊時提示使用者名稱是否存在,二級聯動等等使用場景。

3、js 和 jQuery 的關係?

    jQuery 是一個js 框架,封裝了js 的屬性和方法, 並且增強了js 的功能,讓使用者使用起來更加便利。
    原來使用 js 是要處理很多相容性問題,由jQuery 封裝了低層,就不用處理相容性問題。原生的js 的dom 和事件繫結等操作非常麻煩,jQuert 封裝以後操作非常方便。

4、jQuery 的常用選擇器

ID 選擇器        通過ID 獲取一個元素
Class 選擇器     通過類(css)獲取元素
標籤選擇器        通過標籤獲取元素
通用選擇器        獲取所有得元素

div.myclass      獲取myclass 這個類的div

層次選擇器        
    兒子選擇器 >      獲取下面得子元素
    後代選擇器 空格   獲取下面得後代 包括兒子、孫子等後代
屬性選擇器
    Tag[attrName='test'] 獲取有屬性名為xxx 並且屬性的值為 test 的所有 xxx 標籤
    <input type="checkbox" name="hobby" />吃飯<br/>
    <input type="checkbox" name="hobby" />睡覺<br/>
Input[name="hobby"],表示獲取屬性名為name 並且 name 屬性值為hobby 的所有input 標籤元素

5、jQuery 的頁面載入完畢事件?

    很多時候我們需要獲取元素,但必須等到該元素被載入完畢完成後才能獲取,我們可以把js程式碼放到該元素的後面,但是這樣就會造成js 在我們body中存在不好管理,所有頁面載入完畢所有元素當然已經載入完畢,一般獲取元素做都要在頁面載入完畢後操作。
第一種:
    $(document).ready(function(){

    });
    $(document) 把原生的document 這個dom物件轉換為jQuery 物件,轉換完成後才能呼叫ready 方法

    ready(fn),表示的是頁面結構載入完畢後執行插入函式fn

第二種:
    $(funtion(){

    });
    當頁面載入完畢後執行裡面的函式


和window.onload 的區別
1、jQuery 中的頁面載入完畢事件,表示的是頁面結構載入完畢
2、window.onload 表示的是頁面被載入完畢

    <img src="http://baidu.com/1.jpg" />  onload 必須等頁面的圖片、聲音、圖形等遠端資源載入完畢後才能呼叫。而JQuery 中只需要頁面結構被載入完畢。

6、jQuery 的Ajax 和原生js 實現Ajax 有什麼關係?

    JQuery 中的Ajax 也是通過原生的js 封裝的。封裝完成後讓我們使用起來更加便利,不用考慮底層實現或相容性等處理。
    如果採用原生js 實現Ajax 是非常麻煩的,並且每次都是一樣的。如果我們不使用JQuery 我們也要封裝物件的方法和屬性。有像JQuery 這些已經封裝完成,並且經過很多企業實際的框架,比較可靠並且開源。我們就不需要封裝,直接使用成熟的框架(jQuery)即可。

7、簡單說一下html5?

    html5 是最新版本得 html,是在原來html4 的基礎上增強了一些標籤。
    html 增加了一些像畫板、聲音、影象、視訊、web 儲存等高階功能。但是html5 有一個不好的地方,那就是 html5 太強調語義了,導致開發中都不知道要現在那個標籤。
    在做頁面佈局時,無論頭部、主題、導航等模組使用div 來表示,但html5 的規範,需要使用不同標籤表示。(header foorer等)

8、簡單說一下css3?

    css3 是最新版本的css ,是對原理 css2 的功能增強。
    css3 中提供了一些原來css2 中實現起來比較困難或者不能實現的功能。    
        1、盒子圓角邊框
        2、盒子和文字的陰影
        3、漸變
        4、轉換 移動 縮放 旋轉等
        5、動畫、過度都可以使用動畫
        6、可以使用媒體查詢實現響應式網站
    css3 最大缺點就是要根據不同的瀏覽器處理相容性。對應有一些處理相容性的工具。不用擔心。

9、bootstarp 是什麼?

    Bootstrap 是一個移動裝置優先的UI 框架。我們可以不用寫任何css,js 程式碼就能實現比較漂亮的有互動性的頁面,我們程式設計師對頁面的編寫是有硬傷的,所以要自己寫頁面的話就要使用類似於Bootstrap 這樣的UI框架。
    平時用很多的:
        1、模態框
        2、表單、表單項
        3、佈局
        4、刪格線