明：

该文章为学习使用，严禁用于商业用途和非法用途，违者后果自负，由此产生的一切后果均与作者无关

一、瑞数简介

瑞数动态安全 Botgate（机器人防火墙）以“动态安全”技术为核心，通过动态封装、动态验证、动态混淆、动态令牌等技术对服务器网页底层代码持续动态变换，增加服务器行为的“不可预测性”，实现了从用户端到服务器端的全方位“主动防护”，为各类 Web、HTML5 提供强大的安全保护。

二、瑞数特点

1. 会有多层debugger，可以点击Never pause here过掉debugger
2. 会有多次请求

• 瑞数4、瑞数5有两次相同的请求，瑞数4第一个请求状态码202，瑞数5第一个请求状态412，第一次请求响应的html，会有个script标签外链js加载$_ts=window['$_ts']，外链js代码可以固定，也可以通过对外链js发送请求获取js代码
• 瑞数5.5有两次相同的请求，第一次请求状态码412，响应的html有外链js，此外链js代码可以固定，也可以通过对外链js发送请求获取js代码
• 瑞数6和瑞数5.5编译过程差不多

3. 第一次响应的html，都会包含动态加载的meta标签包含content、两个script标签，

• 瑞数4、瑞数5用第一个script加载包含_ts=window['$_ts']的js文件，第二个script加载一段自执行的js，用于把之前加载的代码处理成可用的js代码，处理后的js字符串，通过call执行，并生成cookie
• 瑞数5.5用第一个script加载包含_ts=window['$_ts']代码，第二个script加载自执行js文件，用于把之前加载的代码处理成可用的js代码，处理后的js字符串，通过call执行，并生成cookie

4. 都会有特有的cookie标识

• 瑞数4：FSSBBIl1UgzbN7N80T，生成值的第一个字符就是代数
• 瑞数5：IdlEqTWW2ERnT，生成值的第一个字符就是代数
• 瑞数5.5：1EzPGwRUoQaWT，生成值的第一个字符就是代数

5. 瑞数会检测当前执行的文件是哪一个，可以使用delete __filename、delete __dirname

三、瑞数5特点

1. 两层debugger，可以点击Never pause here过掉debugger
2. 同一个请求两次
3. 第一次请求失败，状态码是412

• 首先会生成一个js文件：$_ts=window['$_ts']，代码可以固定
• 然后响应返回一个html页面，里面会有动态加载的meta标签包含content、一个script标签加载刚才js文件、一段script标签包含的js代码
• 这段js代码是个自执行方法，会把之前的js代码，转换成可用的js代码，并通过call方法执行eval函数生成vm文件，在vm文件生成cookie，赋值给document.cookie
• 响应的cookie名字是：IdlEqTWW2ERnS

4. 第一次请求js代码生成的 cookie的名字是：IdlEqTWW2ERnT，生成值的第一个字符就是代数
5. 第二次请求，会正确拿到数据

四、找出需要加密的参数

1. js运行atob('aHR0cHM6Ly93d3cuMTAwMTAuY29tL25ldDUvMDc0Lw==') 拿到网址，F12打开调试工具（打开F12会遇到无限debugger，这是个eval执行的debugger，右击左侧代码行点击Never pause here过掉即可），刷新页面，找到 net5/074/ 请求（状态200），鼠标右击请求找到Copy>Copy as cUrl(cmd)

2. 打开网站：https://spidertools.cn/#/curl2Request，把拷贝好的curl转成python代码，新建 liantong.py，把代码复制到该文件

3. 多运行几次liantong.py，会发现请求失败，状态码是412，仔细分析cookie会发现IdlEqTWW2ERnS、IdlEqTWW2ERnT，而IdlEqTWW2ERnT值得第一个字符是5，这是瑞数特点之一，字符5代表是瑞数5代

4. 新建liantong.js，用于放扣下的代码

五、瑞数5 cookie 分析

1. 使用hook定位IdlEqTWW2ERnT，参数生成位置，这里我使用的是油猴

2. 编辑好油猴脚本，启动该脚本，切换到Application，清除浏览器的cookie，一定要清除cookie

3. 清除cookie后，刷新页面后会进入油猴脚本里的debugger，一直点击跳过当前函数执行，就会找到IdlEqTWW2ERnT赋值的地方

4. 分析IdlEqTWW2ERnT赋值的地方，会发现是在_$MK函数中，搜索_$MK会找到调用该函数地方，点击跳过断点，会进入该断点。注意这是个虚拟文件，每次生成的都不一样，需结合当前代码分析

5. 分析右侧的堆栈，找到不属于该虚拟文件的栈，分别点击查看会发现一个call方法，该方法就是生成虚拟文件的地方，这个文件是第一次请求的响应结果

6. 使用无痕窗口打开网站，F12打开调试工具，点击sources，找到事件监听勾选script

7. 切换到Application，清除浏览器的cookie，一定要先清除cookie，清除cookie后，刷新页面，会看到一个js文件，这是第一次请求生成的，把这个文件代码全部拷贝到liantong.js

8. 点击跳过断点，会进入一个html文件，这是第一次请求响应结果，分析文件会发现一个meta标签、一个script标签引入了刚才生成的js、还有一个script标签里面有很多代码，代码用于把之前的js转换成可用的js代码

9. 在该文件搜索.call，会找到一个.call方法执行，在该行打上断点

10. 点击跳过断点，鼠标悬浮到_$PU上会发现很多js字符串，这就是经过该自执行方法转换后的js

11. 这里要注意虚拟文件是动态生成的，每次获取到的都是不一样的，为了方便调试，把html文件替换成本地文件，这样每次生成的虚拟文件就是一样的，右击该html文件名称，点击Override content，如果替换成功后代码都在一行，可以在本地找到该文件，用编辑器打开，格式化一下，并在call的位置打上断点

12. 把script中的自执行方法全部拷贝到liantong.js，运行liantong.js，会发现报window的错误，window是浏览器环境的，node环境不存在，接下来开始补环境

六、补环境

1. 首选在代码顶部补上window环境，并用代理自动把需要补的环境吐出来，新建jsProxy.js把下面代码拷贝过去

// 代理器封装
function getEnv(proxy_array) {
    for(var i=0; i<proxy_array.length; i++){
        handler=`{\n
            get: function(target, property, receiver) {\n
                   console.log('方法：get','    对象：${proxy_array[i]}','    属性：',property,'    属性类型：',typeof property,'    属性值类型：',typeof target[property]);
                   return target[property];
            },
            set: function(target, property, value, receiver){\n
                    console.log('方法：set','    对象：${proxy_array[i]}','    属性：',property,'    属性类型：',typeof property,'    属性值类型：',typeof target[property]);
                    return Reflect.set(...arguments);
            }
        }`;
        eval(`
            try{\n
                ${proxy_array[i]};\n
                ${proxy_array[i]}=new Proxy(${proxy_array[i]},${handler});
            }catch(e){\n
                ${proxy_array[i]}={};\n
                ${proxy_array[i]}=new Proxy(${proxy_array[i]},${handler});
            }   
        `)
    }
}

// proxy_array=['window', 'document', 'location', 'navigator', 'history','screen','target' ]
// getEnv(proxy_array)

module.exports=getEnv

2. 运行liantong.js，会发现在获取window.top时报错了，在控制台输出window.top得知 window.top=window，在代码顶部补上window.top

3. 运行liantong.js，会发现在获取document.createElement时报错了，document.createElement是用来创建标签的，在代码顶部补上document.createElement，之所以return出一个json，是因为标签也是一个对象

4. 运行liantong.js，会发现在获取document.createElement时又报错了，创建的标签是div，补上div，并找到打印信息最后的位置，会看到报错代码

5. 在浏览器call断点处，点击进入该方法内部会找到虚拟文件，在虚拟文件内搜索$xX[_$rB[157]]，会找到该方法的位置，在该行打上断点，点击跳过断点，会进入刚才的断点，把代码信息在控制输出，会发现是获取div下的i标签，获取出的结果是 length:0，在代码顶部补上该代码

6. 运行liantong.js，会发现在获取window.attachEvent时报错了，找到打印信息最后的位置，会看到报错代码，在虚拟文件内搜索g[_$rB[195]]，会找到该方法的位置，在该代码处有个判断，在if和else中都打上断点，点击跳过断点，if断点，把代码信息在控制输出，会发现是window.addEventListener，获取出的结果是 undefined，在代码顶部补上该代码

7. 运行liantong.js，会发现在获取document.getElementsByTagName时报错了，找到打印信息最后的位置，会看到报错代码，在虚拟文件内搜索f[_$rB[157]]，会找到多个该方法的位置，在所有的f[_$rB[157]]打上断点，点击跳过断点，会进入某一个断点，打印出信息，会发现是两个meta对象和length，在代码顶部补上代码

8. 两个meta标签需要补什么代码，就要分析下面的逻辑了，点击跳过当前函数执行，分析代码，会发现需要最后一个标签上的content，需要最后一个标签parentNode.removeChild 移除标签，最后会把content返回，根据分析补上代码

9. 重复运行liantong.js，按照上面的方法补全环境
10. 补完环境，修改liantong.js，再运行，会发现已经拿到IdlEqTWW2ERnT

七、python代码验证结果

1. 修改liantong.js，因为meta中的content、还有js代码都是动态生成的，所以要用字符暂时占位，分别注释掉之前content的值和js，用meta_content、js_code代替

2. 修改fdc.py

3. 点击运行fdc.py，会发现第二个请求报400，那是因为瑞数会检测当前执行的文件是哪一个

4. 修改liantong.js，再运行fdc.py，会发现数据获取成功

八、最终代码

1. liantong.js，代码太多只贴补环境的那块儿

delete __dirname
delete __filename


var getEnv=require('./jsProxy')

//补window环境
window=global
window.top=window
window.addEventListener=function (event) {
    console.log('window中的addEventListener接受的值:', event)
}

//补document
div={
    getElementsByTagName: function (res) {
        console.log('div中的getElementsByTagName接受的值:', res)
        if (res=='i') {
            return {length: 0}
        }
    }
}

meta={
    0: {},
    1: {
        // content: '{qqiWR9xjADLqtZr.GKDUqs39vLCd6fuDojxTsXPqq|[MOVUqGS9kDwYAY2MHmG8qqenYagvFTYnqaVRkcNykUE2QpL1UOm3DmV.UaxMHf24DULSwPQ.o1WoFaQ0osgoFcNzHGWFl1x7iueMEnWPYsGUinpbxrEUmkAWiA36crg6r1VwErNIEG9BVaVFkaqEkf9kra7lrS9tYs3eEPaaxSeIEA9HkkfRiYYWHS7gkPZdkrEPtnQwYs3.eahnr50RXqCjtH09dcbnU7yq4AOBU4TRXVkvoMVtL1OLxi7NNT4YAHqEZm5GKFxqZfCPrWTwLGBbkWL54mK.oiLLSmOEEieM2f_8iwg4amB1DX0kaTVQrgEnzs8CJMW67uDuJ.35XOKaH.0ac80{AVhRPOD1oF7LTncUsEzy56uo8iJ7aOK.T3d7d7kbbH.qS7sbNHjwPZbUgFjASBsb.WM9dBo_PH_LpL1cfl4096k162hsQioxBGHtAihVlwBPeCtEe8.qfQg.wHVg9MepzcbGPT1sAl.orvE_e5EwA2MzQ9Wbt9r1r0r4q!x7z,aac,amr,asm,avi,bak,bat,bmp,bin,c,cab,css,csv,com,cpp,dat,dll,doc,dot,docx,exe,eot,fla,flc,fon,fot,font,gdb,gif,gz,gho,hlp,hpp,htc,ico,ini,inf,ins,iso,js,jar,jpg,jpeg,json,java,lib,log,mid,mp4,mpa,m4a,mp3,mpg,mkv,mod,mov,mim,mpp,msi,mpeg,obj,ocx,ogg,olb,ole,otf,py,pyc,pas,pgm,ppm,pps,ppt,pdf,pptx,png,pic,pli,psd,qif,qtx,ra,rm,ram,rmvb,reg,res,rtf,rar,so,sbl,sfx,swa,swf,svg,sys,tar,taz,tif,tiff,torrent,txt,ttf,vsd,vss,vsw,vxd,woff,woff2,wmv,wma,wav,wps,xbm,xpm,xls,xlsx,xsl,xml,z,zip,apk,plist,ipaqqqqqqqqqqqqqqkRxA1WYW8i2ZaYc0IH9V_UAlwSf3|gYBRPSpKnWLGmzpn1RFgTvfn.WMN2nKrBqVWPwqrME6aBAcYAxK7XifNgJ9qoIDrOhYVmscevR1Qa3rJyk2QrpCg4rYlO8OZfH6qvFCY8H209hArJH6q1VnpSrlaPkAxixrTXpaEYh2ZXAfJ4JoABM1TUmKV0p1w6lTaAFbYgEArBRbVr393oFOmsRvqi8DwDEYpOFkzaRuL9ECQFHfAFhcyeEqLuhcQr3al2qpe5oO7YraggcozOmq06MaQaWcW5HOqD3aEPhnL4hrVNECWVlGqJ3C0IMkzUomlrq 0wR7HvJ6IsUC410DntKRngA;QyqA82EGtIB6ePNEeYo9NG;iEm6gdSTTpYiqU10OlvsnG;yMG8gk5okQ97gP4eb.IadA;T8F36FaS9AtR4sXBkRr0iG;RTlM3IYjAzboXbIiNSIFRA;t7_svh3Kc3.VU9jOjAJgdq;.8D9Zx78FrKF.Zn4xbfmIG;IMhCM7gXESIqShs5TNMo9A;pvBPF7OtrK6trS5vZYizwa;9qxqLXuEeDQeAlNfAL_l.A;VNeyFcNDtQZhV2sfCxyHqA;kT4JL2WRSOhvUIEcOjSrva;LpFhLGWYI8eFx_X999MLEq;NqssQaVItFB0TevtNxJrkG;AI3RN3R7lP0BBnYsoCO5KG;xrYRhwM6FYW7zCsPL.iecq;0kOXzZzt1eXLrlPo.QQ4xG;ApKNqLIRoybF5rIxSnabBG;hfgZrtz_KscdFC6a3f1wKA;Ddfe167m26649h_g.S8UKVgXBt1074790432r0YQLJiVGhVajrMQpjFqUZuNqV80Tt89zds6ycR9fGsCNkl3650r0q}!DBEbb61kMgq_GKiDIZLg9oiwINe0CsjYI7qgLVKAwKS03oewpcl4FvNLIO7y1Tff8kgLIo2mtKfXR6JJw6Y_YTwPJKJxRTp2FUNdsvSGFU2gYvm7YUlP16wcwTJjWYNC36rssnfssmwnM0eVKbYnVvZFwTxcov2N1Dx0MKEKUCfl1YLAi0Y_KDyAxfA7VnfnQ9fZKcfIsvwaIDWDEvy5tmVaiUaqqqqqqqqqqqqqq',
        content:'meta_content',
        parentNode: {
            removeChild: function (tag) {
                console.log('meta中的removeChild接受的值:', tag)
            }
        }
    },
    length: 2
}

script={
    0: {
        getAttribute: function (attr) {
            if (attr=='r') {
                return 'm'
            } else {
                console.log('script-0中的getAttribute接受的值:', attr)
            }
        },
        parentElement: {
            removeChild: function (tag) {
                console.log('script-0中的removeChild接受的值:', tag)
            }
        }
    },
    1: {
        getAttribute: function (attr) {
            if (attr=='r') {
                return 'm'
            } else {
                console.log('script-1中的getAttribute接受的值:', attr)
            }
        },
        parentElement: {
            removeChild: function (tag) {
                console.log('script-1中的removeChild接受的值:', tag)
            }
        }
    },
    length: 2
}

document={
    createElement: function (tag) {
        if (tag=='div') {
            return div
        } else {
            console.log('document中的createElement接受的值:', tag)
            return {}
        }
    },
    getElementsByTagName: function (tag) {
        if (tag=='meta') {
            return meta
        } else if (tag=='script') {
            return script
        } else {
            console.log('document中的etElementsByTagName接受的值:', tag)
            return {}
        }
    },
    addEventListener: function (event) {
        console.log('addEventListener中的addEventListener接受的值:', event)
    }
}

//补location
location={
    "href": "http://www.fangdi.com.cn/index.html",
    "origin": "http://www.fangdi.com.cn",
    "protocol": "http:",
    "host": "www.fangdi.com.cn",
    "hostname": "www.fangdi.com.cn",
    "pathname": "/index.html",
}


proxy_array=['window', 'document', 'location', 'navigator', 'history', 'screen', 'target']
getEnv(proxy_array)

setTimeout=function () {}
setInterval=function () {}

2. liantong.py

言：

最近总结了一些自己做题过程中遇到的易错问题，附带解析，希望对大家有帮助。

1.下面哪些执行结果为true()

A 'foo'==new function(){ return String('foo'); };

B 'foo'==new function(){ return new String('foo'); };

C []==0

D ![]

E !0

点击查看答案

答案：B C E

点击查看涉及到的知识点

1.new返回值

2.String()与 new String()区别

3.隐式类型转换

解析：

A 'foo'==new function(){ return String('foo'); };

1. String('foo')=> 'foo'
2. new function 的return会判断返回值是否为引用数据类型，如果不是引用数据类型会返回空对象{}，所以new function(){ return String('foo'); }返回{}
3. 'foo'=={} ，{}进行隐式类型转换，{}调用valueOf方法返回{}对象，判断{}不是基本数据类型，继续调用toString()方法，返回'[object Object]'。
4. 'foo'=='[object Object]',返回false

B 'foo'==new function(){ return new String('foo'); };

1. new String('foo');返回String对象。
2. 'foo'==new String('foo'), new String('foo')调用自身valueOf方法，返回'foo'
3. 'foo'=='foo' 返回 true

C []==0

引用数据类型会先转换为String，然后再转换为number

1. 数组会先调用自身toString()方法 [].toString();=> ''
2. 使用Number('')转为数字 Number('')=> 0
3. 0==0=> true

D ![]

将[]隐式转化为布尔值

1. Boolean([])=> true
2. !true=> false

E !0

1. Boolean(0)=> false
2. !false=> true

Tips:

在==比较时遵循以下原则

1. 如果有一个操作数是布尔值，则在比较相等性之前，将其转换为数值；

2. 如果一个操作数是字符串，另一个操作数是数值，在比较之前先将字符串转换为数值；

3. 如果一个操作数是对象，另一个操作数不是，则调用对象的 valueOf() 方法，用得到的基本类型值按照前面的规则进行比较；

4. 如果有一个操作数是 NaN，无论另一个操作数是什么，相等操作符都返回 false；

5. 如果两个操作数都是对象，则比较它们是不是同一个对象。如果指向同一个对象，则相等操作符返回 true；

6. 在比较相等性之前，不能将 null 和 undefined 转成其他值。

7. null 和 undefined 是相等的。

2.以下哪些事件会在页面加载完成（onload）之前触发？

A readystatechange

B pageshow

C beforeunload

D DOMContentLoaded

点击查看答案

答案：A D

点击查看涉及到的知识点

1.渲染过程

解析

A readystatechange

document有个readyState属性来描述document的状态，当readyState发生变化时会触发readystatechange事件。

loading:文档加载中

interactive：文档加载完毕，此时同样会触发DOMContentLoaded事件

complete：文档以及所引入的图片等资源加载完毕，此时同样会触发load事件

B pageshow

当load事件触发完毕后会触发pageshow事件

C beforeunload

当dom卸载时会触发，浏览器刷新页面、跳转页面、关闭页面时会触发。

D DOMContentLoaded

当dom解析完毕，同步js、css加载完毕时触发，会早于load事件。

Tips：

页面加载渲染简易流程

html解析为DOM，css解析为CSSOM，合并css与dom生成渲染树，布局，并进行渲染

1.浏览器请求html

2.浏览器获取到html

3.浏览器解析html

4.解析到head标签，如果同步js则停止dom解析（等待js下载完毕并执行后继续dom解析），如果是css则不影响dom继续解析（但是影响dom渲染）。

5.进入body标签

1. 如果只有dom则解析dom，同css树合并为渲染树，进行渲染。
2. 如果有外链js，如果是同步js则下载并执行js，此时dom暂停解析，等待js执行完毕后继续解析，解析后生成dom树，并渲染。
3. 如果有js也有css引入，同步js阻塞dom解析，dom等待js下载执行完，dom解析完毕后还需要等待css下载完成，然后dom与cssom合并为渲染树然后渲染。 6.当dom解析完毕

Tips:

浏览器遇到通过src引入外部js时，会先渲染已解析的dom

例：

引入外部js， 遇到script src时会先渲染已解析的dom

test.js

var i = 1000000000
while(i>0){
    i--
}
console.log("解析完成")

html

<h1>Hello</h1>
<script type="text/javascript" src="test.js"></script>
<h1>world</h1>

执行时，页面会先显示Hello，等几秒后会显示world


页面内写的js会阻塞dom解析与渲染
<h1>Hello</h1>
<script type="text/javascript">
 var i = 1000000000
 while(i>0){
     i--
 }
 console.log("解析完成")
</script>
<h1>world</h1>

js执行完后才会显示 Hello world

3.关于这段代码正确的结论是：（）

var F=function(){};

Object.prototype.a=function(){};

Function.prototype.b=function(){};

var f=new F();

A f能取到a，但取不到b

B f能取到a,b

C F能取到b，不能取到a

D F能取到a，不能取到b

点击查看答案

答案：A

点击查看涉及到的知识点

1.原型

解析：

一. f能访问那些

1. f的__proto__指向的是F构造函数的prototype。
2. 属性查找是通过原型链查找的。
3. f.__proto__=F.prototype ,F.prototype.__proto__=Object.prototype，Object.prototype.__proto__=null。
4. f可以获取到a。

二. F能访问那些

1. F.proto=Function.prototype。所以F能访问到b
2. Function.prototype.proto=Object.prototype。所以F能访问a。
3. 结论，F能访问a跟b。

4.以下结果里，返回 false 的是？

A []==true

B !![]

C NaN==NaN

D null==undefined

点击查看答案

答案：A C

点击查看涉及到的知识点

1.隐式类型转换

解析：

A []==true

如果有一个操作数是布尔值，则在比较相等性之前，将其转换为数值；

1. []==Number(true)=> []==1
2. [].toString()==1=> ''==1
3. Number('')==1=> 0==1
4. false

B !![]

1. Boolean([])=> true
2. !true=> false
3. !false=> true

C NaN==NaN

如果有一个操作数是 NaN，无论另一个操作数是什么，相等操作符都返回 false；

1. false

D null==undefined

null 和 undefined 是相等的。

1. true

5.下面的代码将返回：

Number(null);

A Null

B 0

C undefined

D 1

点击查看答案

答案：B

点击查看涉及到的知识点

1.Number函数的用法

解析：

1. Number(null)=> 0
2. Number(undefined)=> NaN
3. Number(123a)=> NaN

6.假设有如下代码，那么a(10)的返回结果是？（ ）

function a(a)
{
  a^=(1<<4)-1;
   return a;
}

A 5

B 10

C 15

D 16

点击查看答案

答案：A

点击查看涉及到的知识点

1.二进制转换

2.左移运算符

3.异或运算符

解析：

涉及到异或、二进制转换、

1. a^=(1<<4)-1=> a=a ^ ((1<<4) -1);
2. 带入参数 a=10 ^((1<<4) -1);
3. ((1<<4) -1) 1<<<4 转换为二进制 1000010000 转换为十进制=> 2?=> 16((1<<4) -1)=> 15
4. 10 ^ 15 10转化为二进制=> 101015转化为二进制=> 111110^15=> 101101=>转化为10进制 22+1=> 5
5. 返回5

Tips:

二进制转换为十进制：

除二取余，然后倒序排列，高位补零 例：

10转化为2进制
1.  10%2 = 0
2.  5%2  = 1
3.  2%2  = 0
4.  1    = 1

倒序排列：
1010  

7.假设val已经声明,可定义为任何值。则下面js代码有可能输出的结果为:

console.log('Value is ' + (val != '0') ? 'define' : 'undefine');

A Value is define

B Value is undefine

C define

D undefine

E Value is define 或者 Value is undefine

F define 或者 undefine

G 其它选项都有可能

点击查看答案

答案：C

点击查看涉及到的知识点

1.运算符优先级

解析： 考察运算符优先级，+优先级高于三目运算，上面代码等价于

('Value is ' + (val != '0')) ? 'define' : 'undefine'

8.运行以下程序,y和z的最终结果为:

<script> 
    var m= 1, j = k = 0; 
    function add(n) { 
        return n = n+1; 
  } 
    y = add(m); 
    function add(n) { 
        return n = n + 3; 
    } 
z = add(m); 
</script> 

A 2,4

B 4,4

C 2,2

D 报异常

点击查看答案

答案：B

点击查看涉及到的知识点

1.函数提升

2.值传递

解析：

1. 同名函数会相互覆盖，由于函数存在函数提升，后定义的函数会覆盖之前定义的函数，所以y，z调用的都是第二个add函数。
2. 传入函数的m因为是基本类型，在函数内修改不会影响外部的变量

结尾：

在错题中寻找自己的知识薄弱点，巩固并完善自己的知识体系，建议收藏，经常看看，避免遗忘~

示：点击上方"蓝色字体"↑ 可以订阅噢！

1.对WEB标准以及W3C的理解与认识

标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能 被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站 易用性;

2.xhtml和html有什么区别

HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言

最主要的不同：

XHTML 元素必须被正确地嵌套。

XHTML 元素必须被关闭。

标签名必须用小写字母。

XHTML 文档必须拥有根元素。

3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?

用于声明文档使用那种规范(html/Xhtml)一般为 严格 过度 基于框架的html文档

加入XMl声明可触发，解析方式更改为IE5.5 拥有IE5.5的bug

4.行内元素有哪些?块级元素有哪些?CSS的盒模型?

块级元素：div p h1 h2 h3 h4 form ul

行内元素: a b br i span input select

Css盒模型:内容，border ,margin，padding

5.CSS引入的方式有哪些? link和@import的区别是?

内联 内嵌 外链 导入

区别 ：同时加载

前者无兼容性，后者CSS2.1以下浏览器不支持

Link 支持使用javascript改变样式，后者不可

6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?

标签选择符 类选择符 id选择符

继承不如指定 Id>class>标签选择

后者优先级高

7.前端页面有哪三层构成，分别是什么?作用是什么?

结构层 Html 表示层 CSS 行为层 js

8.css的基本语句构成是?

选择器{属性1:值1;属性2:值2;……}

9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?

Ie(Ie内核) 火狐(Gecko) 谷歌(webkit) opear(Presto)

10.写出几种IE6 BUG的解决方法

1.双边距BUG float引起的 使用display

2.3像素问题 使用float引起的 使用dislpay:inline -3px

3.超链接hover 点击后失效 使用正确的书写顺序 link visited hover active

4.Ie z-index问题 给父级添加position:relative

5.Png 透明 使用js代码 改

6.Min-height 最小高度 !Important 解决’

7.select 在ie6下遮盖 使用iframe嵌套

8.为什么没有办法定义1px左右的宽度容器(IE6默认的行高造成的，使用over:hidden,zoom:0.08 line-height:1px)

9.ie 6 不支持!important

11.img标签上title与alt属性的区别是什么?

Alt 当图片不显示是 用文字代表。

Title 为该属性提供信息

12.描述css reset的作用和用途。

Reset重置浏览器的css默认属性 浏览器的品种不同，样式不同，然后重置，让他们统一

13.解释css sprites，如何使用。

Css 精灵 把一堆小的图片整合到一张大的图片上，减轻服务器对图片的请求数量

14.浏览器标准模式和怪异模式之间的区别是什么?

盒子模型 渲染模式的不同

使用 window.top.document.compatMode 可显示为什么模式

15.你如何对网站的文件和资源进行优化?期待的解决方案包括：

文件合并

文件最小化/文件压缩

使用CDN托管

缓存的使用

16.什么是语义化的HTML?

直观的认识标签 对于搜索引擎的抓取有好处

17.清除浮动的几种方式，各自的优缺点

1.使用空标签清除浮动 clear:both(理论上能清除任何标签，，，增加无意义的标签)

2.使用overflow:auto(空标签元素清除浮动而不得不增加无意代码的弊端,,使用zoom:1用于兼容IE)

3.使用afert伪元素清除浮动(用于非IE浏览器)

18.css hack

<!--[if IE 6]--><![end if]-->

_marging \IE 6

+margin \IE 7

Marging:0 auto 所有Ie

Margin >Margin \0 \\IE 8< \IE 8

想认识志同道合的朋友一起学习web

加入我们的学习QQ群 190166743

丰富的学习资源，周一到周四免费直播公开课

长按图片，识别二维码即可入群

你可能感兴趣的精彩内容

长按关注：《UI设计自学平台》