js闭包 & 匿名函数递归

昨天面试了上海的MCAKE，面试官应该是个比较较真之人。自觉面试不是很好，但被邀请30号去公司面试。
被面试官问了许多问题，有
1.CSS中的盒子模型（如何兼容？我的回答是使用box-sizing显式指明width包含padding和border；面试官指出还有另外一种，即在IE6-8中可以使用标准模式而不是怪异模式）
浏览器解析时到底使用标准模式还是怪异模式，与你网页中的DTD声明直接相关，DTD声明定义了标准文档的类型（标准模式解析）文档类型，会使浏览器使用相应的方式加载网页并显示，忽略DTD声明,将使网页进入怪异模式(quirks mode)。
标准模式中IE6不认识!important声明，IE7、IE8、Firefox、Chrome等浏览器认识；而在怪异模式中，IE6/7/8都不认识!important声明，这只是区别的一种，还有很多其它区别。
在标准模式下，一个块的总宽度= width + margin(左右) + padding(左右) + border(左右)
在怪异模式下，一个块的总宽度= width + margin(左右)（即width已经包含了padding和border值）

Paste_Image.png

Paste_Image.png

CSS3中box-sizing有两个值：
content-box 这是由 CSS2.1 规定的宽度高度行为，在宽度和高度之外绘制元素的内边距和边框。
border-box 为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。
2.CSS中块元素有行内元素的区别
一句话：块能设置宽度而行内元素不能
3.JS闭包
这个问题自己之前看过书上的定义，很学术，所以不明白。
但昨天在网络上搜索了下，感觉一下子明白了许多，今天写代码还用上了。

/*此处将消息的编号i作为函数messageInit的内部变量，保证除了showMessage不能通过其他手段改变它的值*/
function messageInit(){
    var i=1;
    var wxmusic = document.getElementById("audiowx");
    function showM(){
        switch(i){
            case 1:
            case 2:
            case 3:
            case 4:
            case 5:
            case 7:
                $(".message" + i).show(); wxmusic.play(); i++; setTimeout(arguments.callee,2000); break;
            case 6:
                $(".message" + i).show(); wxmusic.play(); i++; setTimeout("nextpage(5)",2000); break;
            case 8:
                $(".message" + i).show(); wxmusic.play(); i++; setTimeout("$(\".page12\").css(\"display\",\"block\");",2000); break;
            default:
                break;
        }
        console.log(i);
    }
    return showM;
}
var showMessage = messageInit();

在上面的代码中保护了变量i，简单理解闭包就是函数中的函数（勿喷，以后理解深了会更新）。
在内部函数showM中我需要递归调用，但是以为函数messageInit执行一次后内部变量被清了，但是因为showM还被使用，所以内存中仍存在，但通过showM就不能访问到了，这里使用arguments.callee就表示了被调用的函数，从而实现了内部函数的递归调用。这种方法同样适用于匿名函数。