HTML5 面試題總結

1 行內元素,塊級元素,空元素?
行內: a b span img input select strong
塊級: div ul li h1 h12 h3 p….
空元素:br hr link meta等
HTML5移除了一些元素如:big,center,font,frame,frameset等
處理HTML5標籤兼容性的問題方式:
1. IE6-IE8支持document.createElement產生的標籤,可以利用這個特性兼容
2. 使用html5shim框架

    var arr = [3,6,2,5,9,4],len = arr.length;
    for(var i = 0;i<len;i++){
        for(var j = 0;j<len-i-1;j++){
            if(arr[j] < arr[j+1]){
                var temp = arr[j];
                arr[j] = arr[j+1];
                arr[j+1] = temp;
            }
        }
    }

==與===

===判斷規則:
1 首先比較類型,如果類型不同,則肯定不同
在類型相同的前提下:
2 如果兩邊都是數值,且同一個值,則相等,如果有至少一個NaN,則不相等
3 如果兩個值都是字符串,每個位置字符都一樣,則相等
4 如果兩個值都是true,或者false,則相等
5 如果兩個值都引用同一個對象或者函數,則相等
6 如果兩個值都是null或者undefined,則相等;

==判斷規則:
如果兩個值類型相同,進行===比較,
如果兩個值類型不同,則需要進行類型轉換再比較:
1 如果一個是null,一個是undefined,則相等
2 如果一個是字符串,一個是數值,則要轉換成數值再進行比較
3 如果一個boolean,一個是數值,則true轉換爲1再比較,如果是false轉換成0再比較。
如果一個對象一個數值或字符串,要用對象的toString()和valueOf()方法轉換成相應的類型再進行比較。

舉例:

    0 == ""; //true
    0 == false; //true
    0 === ""; //false
    0 === false; // false
    "" === false; //false
    1 == "1"; //true
    1 === "1";  //false

數組去重

    Array.prototype.unique1 = function(){
        var newArr = [],obj = {};
        for(var i = 0;i<this.length;i++){
            if(!obj[this[i]]){
                newArr.push(this[i]);
                obj[this[i]] = 1;
            }
        }
        return newArr;
    }
    //es6
    var newArr = [...new Set(arr)];
    var newArr = Array.from(new Set(arr));

ajax工作原理
獲取XMLHttpRequest對象,

    function getRequest(){
        var xmlHttp = null;
        try{
            xmlHttp = new XMLHttpRequest();
        }catch(e){
            try{
                xmlHttp = new ActiveXObject("Microsoft.XMLHttp");
            }catch(e){

            }
        }
        return xmlhttp;
    }

調用函數open(method,url)
發送請求send();
接收相應
request.onreaystatechange = function(){
if(request.readyState == 4 && request.state == 200){
var restule = request.responseText;
}
}
ajax status:
200 請求成功
404 沒有找到
500 服務器出錯
304 請求成功,但是源文件沒有修改。
403 禁止訪問

清除浮動CSS

推薦使用的:
在父級DIV上定義僞類:after
parentDiv:after{display:block;height:0;contetn:”“;clear:both;visibility:hidden}
parentDiv{zoom:1;}//用來兼容IE6

響應式佈局
@media screen only not and

null和undefined
null表示沒有對象,轉換數值爲0,
初始化一個變量,可能被賦值爲一個對象;
undefined,表示缺少值,數值轉化爲NaN
變量被聲明瞭但是沒有賦值,調用函數時,應該提供的參數沒有提供,
對象沒有賦值的屬性,函數沒有返回值時,返回undefined;
null表示無值,undefined表示未聲明的變量,或已聲明,但並沒有賦值。
null==undefined結果爲true.

閉包
閉包就是能夠讀取其他函數內部變量的函數,只有定義在一個函數內部的子函數才能
讀取這個函數的變量,可理解成:定義在一個函數內部的函數。
本質上,閉包就是將函數內部和函數外部連接起來的橋樑。

onload和ready的區別
ready:表示文檔結構已經加載完成(不包含圖片等非文字媒體文件)
onload:表示頁面包含圖片等在內的所有元素都加載完成

js原型鏈
每個對象都有一個prototype屬性,稱之爲原型,而原型的值也是一個對象,因此他也有自己的原型,這樣串聯起來就形成了一條原型鏈,原型鏈的鏈頭是Object,他的prototype值比較特殊,爲null.
原型鏈的作用是用於對象繼承,函數A的原型屬性是一個對象,當這個函數被用作構造函數來創建實例時,該函數的原型屬性將被作爲原型賦值給所有對象實例。
當訪問一個對象的一個屬性時,首先查找對象本身,若未找到,則繼續查找其原型對象的屬性。只要沒有被覆蓋,對象原型的屬性就能在所有的實例中找到。

return返回值
function foo(){
return
{
bar:’hello’
}
}
在js中,return,break,continue語句中,如果後面緊跟換行,解析器一定會在後面填充分號,所以這個函數返回值爲undefined;

NaN
Not a Number的縮寫,使用isNaN()來判斷一個值是否爲NaN;
isNaN(NaN) true
isNaN(22) false
isNaN(‘AA’) true
isNaN(‘343fdf’) true
typeof NaN //number
NaN === NaN false
NaN === undefined false;

短路運算
邏輯與和邏輯或會返回一個值,並且二者都是短路運算符

邏輯與返回第一個是false的操作數或最後一個爲true的運算符
1&&2&&0 //0
1&&0&&1 //0
1&&2&&3 //3
如果某個操作數爲false,則之後的都不會被計算

邏輯或返回第一個爲true的操作數或最後一個是false的操作數

1||2||0 //1
0||2||1 //2 第一個是0,爲false,那麼還要繼續計算下去,第二個2爲true,則返回2
0||0||false //false
如果某個操作數爲true,則之後的值都不會被計算

判斷爲數組
Array.isArray()
toString.call([]); //”[object Array]”
var arr = [];
arr.constructor://Array
instanceof Array;//true

事件綁定
addEventListener(events,callback,captrue)//captrue 默認爲false,冒泡執行,true就是捕獲執行
IE9以前使用attachEvent(on+event,callback)只支持冒泡

var event = event || window.event;
var target = event.srcElement || event.target
document.documentElement.clientWidth || document.body.clientWidth

發佈了32 篇原創文章 · 獲贊 6 · 訪問量 7萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章