摘要：為了實(shí)現(xiàn)這一點(diǎn)，他們創(chuàng)建了兩種呈現(xiàn)模式標(biāo)準(zhǔn)模式和混雜模式。不存在或形式不正確會(huì)導(dǎo)致和文檔以混雜模式呈現(xiàn)。無論是否編寫了有效的，如果選擇了錯(cuò)誤的，那么頁面就將以混雜模式呈現(xiàn)，其行為就可能會(huì)有錯(cuò)誤或不可預(yù)測。

什么是web標(biāo)準(zhǔn)？

WEB標(biāo)準(zhǔn)不是某一個(gè)標(biāo)準(zhǔn)，而是一系列標(biāo)準(zhǔn)的集合。網(wǎng)頁主要由三部分組成：結(jié)構(gòu)（Structure）、表現(xiàn)（Presentation）和行為 （Behavior）。
對應(yīng)的標(biāo)準(zhǔn)也分三方面：結(jié)構(gòu)化標(biāo)準(zhǔn)語言主要包括XHTML和XML，表現(xiàn)標(biāo)準(zhǔn)語言主要包括CSS，行為標(biāo)準(zhǔn)主要包括對象模型（如 W3C DOM）、ECMAScript等。這些標(biāo)準(zhǔn)大部分由W3C起草和發(fā)布，也有一些是其他標(biāo)準(zhǔn)組織制訂的標(biāo)準(zhǔn)，比如ECMA（European Computer Manufacturers Association）的ECMAScript標(biāo)準(zhǔn)。

請解釋一下DOCTYPE的作用，有DOCTYPE和沒有DOCTYPE有什么區(qū)別？

聲明位于位于HTML文檔中的第一行，處于 標(biāo)簽之前。告知瀏覽器的解析器用什么文檔標(biāo)準(zhǔn)解析這個(gè)文檔。DOCTYPE不存在或格式不正確會(huì)導(dǎo)致文檔以兼容模式呈現(xiàn)。

XHTML與HTML有什么區(qū)別

XHTML 元素必須被正確地嵌套。

XHTML 元素必須被關(guān)閉。

標(biāo)簽名必須用小寫字母。

XHTML 文檔必須擁有根元素。

嚴(yán)格模式與混雜模式——如何觸發(fā)這兩種模式，區(qū)分它們有何意義。

當(dāng)瀏覽器廠商開始創(chuàng)建與標(biāo)準(zhǔn)兼容的瀏覽器時(shí)，他們希望確保向后兼容性。為了實(shí)現(xiàn)這一點(diǎn)，他們創(chuàng)建了兩種呈現(xiàn)模式：標(biāo)準(zhǔn)模式和混雜模式。

在標(biāo)準(zhǔn)模式中，瀏覽器根據(jù)規(guī)范呈現(xiàn)頁面；在混雜模式中，頁面以一種比較寬松的向后兼容的方式顯示。
混雜模式通常模擬老式瀏覽器的行為以防止老站點(diǎn)無法工作。
瀏覽器根據(jù)DOCTYPE是否存在以及使用的哪種DTD來選擇要使用的呈現(xiàn)方法。如果XHTML文檔包含形式完整的DOCTYPE，那么它一般以標(biāo)準(zhǔn)模式 呈現(xiàn)。對于HTML4.01文檔，包含嚴(yán)格DTD的DOCTYPE常常導(dǎo)致頁面以標(biāo)準(zhǔn)模式呈現(xiàn)。包含過渡DTD和URI的DOCTYPE也導(dǎo)致頁面以標(biāo)準(zhǔn) 模式呈現(xiàn)，但是有過渡DTD而沒有URI會(huì)導(dǎo)致頁面以混雜模式呈現(xiàn)。DOCTYPE不存在或形式不正確會(huì)導(dǎo)致HTML和XHTML文檔以混雜模式呈現(xiàn)。
根據(jù)DOCTYPE是否存在選擇呈現(xiàn)模式，被稱為DOCTYPE切換或DOCTYPE偵測。
DOCTYPE切換是瀏覽器用來區(qū)分遺留文檔和符合標(biāo)準(zhǔn)的文檔的手段。無論是否編寫了有效的CSS，如果選擇了錯(cuò)誤的DOCTYPE，那么頁面就將以混雜 模式呈現(xiàn)，其行為就可能會(huì)有錯(cuò)誤或不可預(yù)測。因此一定要在每個(gè)頁面上包含形式完整的DOCTYPE聲明，并且在使用HTML時(shí)選擇嚴(yán)格的DTD。

寫出3個(gè)使用this的典型應(yīng)用

（1）在html元素事件屬性中使用，如：

（2）構(gòu)造函數(shù)

function Animal(name, color) {
　　this.name = name;
　　this.color = color;
}

（3）input點(diǎn)擊，獲取值

(4)apply()/call()求數(shù)組最值

var  numbers = [5, 458 , 120 , -215 ]; 
var  maxInNumbers = Math.max.apply(this, numbers);  
console.log(maxInNumbers);  // 458
var maxInNumbers = Math.max.call(this,5, 458 , 120 , -215); 
console.log(maxInNumbers);  // 458

數(shù)組去重

// 方法一
var norepeat = funtion(arr){
    return arr.filter(function(val, index, array){
        return array.indexOf(val) === index;
    });
}
norepeat()


// 方法二
var set = new Set(arr);

數(shù)組求和

var sum = function(arr){
    return arr.reduce(function(x, y){
        return x + y
    });
}

sum()

如何顯示/隱藏一個(gè)DOM元素？

Display
visibility
Opacity

JavaScript中如何檢測一個(gè)變量是一個(gè)String類型？

function isString(str){
 return (typeof str == "string" || str.constructor == String);
}

網(wǎng)頁中實(shí)現(xiàn)一個(gè)計(jì)算當(dāng)年還剩多少時(shí)間的倒數(shù)計(jì)時(shí)程序，要求網(wǎng)頁上實(shí)時(shí)動(dòng)態(tài)顯示“××年還?！痢撂臁痢?xí)r××分××秒”

function counter() { 
    var date = new Date(); 
    var year = date.getFullYear();
    var date2 = new Date(year, 12, 31, 23, 59, 59);
    /*轉(zhuǎn)換成秒*/
    var time = (date2 - date) / 1000;
    var day = Math.floor(time / (24 * 60 * 60))
    var hour = Math.floor(time % (24 * 60 * 60) / (60 * 60))
    var minute = Math.floor(time % (24 * 60 * 60) % (60 * 60) / 60);
    var second = Math.floor(time % (24 * 60 * 60) % (60 * 60) % 60);
    var str = year + "年還剩" + day + "天" + hour + "時(shí)" + minute + "分" + second + "秒";
    console.log(str);
}
window.setInterval("counter()", 1000);

補(bǔ)充代碼，鼠標(biāo)單擊Button1后將Button1移動(dòng)到Button2的后面.

JavaScript中如何對一個(gè)對象進(jìn)行深度clone

方法一：

function deepClone(obj){
  var str = JSON.sringify(obj);
  var newobj = JSON.parse(str);
  return newobj;
 }

方法二：

//深克隆
function deepClone(obj){
    if (!obj) { return obj; }
    var o = obj instanceof Array ? [] : {};
    for(var k in obj){
        if(obj.hasOwnProperty(k)){
            o[k] = typeof obj[k] === "object" ? deepClone(obj[k]) : obj[k];
        }
    }
    return o;
}

鼠標(biāo)點(diǎn)擊頁面中的任意標(biāo)簽，alert該標(biāo)簽的名稱．（注意兼容性）

請編寫一個(gè)JavaScript函數(shù) parseQueryString，它的用途是把URL參數(shù)解析為一個(gè)對象

var url = “http://witmax.cn/index.php?key0=0&key1=1&key2=2″;


function parseQueryString(argu){
    var str = argu.split("?")[1];
    var result = {};
    var temp = str.split("&");
    for(vari=0; i


如何點(diǎn)擊每一列的時(shí)候alert其index?

    
這是第一條
    
這是第二條
    
這是第三條


(function A() {
    var index = 0;
    var ul = document.getElementById("test");
    var obj = {};
    for (var i = 0, l = ul.childNodes.length; i < l; i++) {
        if (ul.childNodes[i].nodeName.toLowerCase() == "li") {
            var li = ul.childNodes[i];
            li.onclick = function() {
                index++;
                alert(index);
            }
        }
    }
})();



請給出異步加載js方案，不少于兩種
1）defer，只支持IE
   2）async/await
   3）創(chuàng)建script，插入到DOM中，加載完畢后callBack，見代碼：


請?jiān)O(shè)計(jì)一套方案，用于確保頁面中JS加載完全
function loadScript(url, callback){
    var script = document.createElement("script")
    script.type = "text/javascript";
    if (script.readyState){ //IE
        script.onreadystatechange = function(){
            if (script.readyState == "loaded" || script.readyState == "complete"){
                script.onreadystatechange = null;
                callback();
            }
        };
    } else { //Others: Firefox, Safari, Chrome, and Opera
        script.onload = function(){
            callback();
        };
    }
    script.src = url;
    document.body.appendChild(script);
}

loadScript("http:/xxx.min.js",function(){
    alert("ok");
})


判斷一個(gè)字符串中出現(xiàn)次數(shù)最多的字符，統(tǒng)計(jì)這個(gè)次數(shù)
方法一：利用json數(shù)據(jù)個(gè)數(shù)“鍵”唯一的特性
方法二、利用數(shù)組reduce()方法；同時(shí)應(yīng)用一個(gè)函數(shù)針對數(shù)組的兩個(gè)值(從左到右)。
方法三、利用正則表達(dá)式的replace對str的每一項(xiàng)進(jìn)行檢測



歡迎閱讀：
2019年前端面試題-01
2019年前端面試題-02
2019年前端面試題-03

我是Cloudy，年輕的前端攻城獅一枚，愛專研，愛技術(shù)，愛分享。 
個(gè)人筆記，整理不易，感謝閱讀、點(diǎn)贊和收藏。
文章有任何問題歡迎大家指出，也歡迎大家一起交流前端各種問題！