面试题
1、点击某个标签，alert出标签名，注意浏览器兼容性。
var EventUtil = {
addHandler: function(element, type, handler) {
// DOM2级事件处理程序
// IE9+、Firefox、Safari、Chrome、Opera
if(element.addEventListener) {
// false表示在冒泡阶段调用事件处理程序
// true表示在捕获阶段调用事件处理程序
// 通过addEventListener()添加的匿名函数无法移除
// this对象引用的是当前元素
element.addEventListener(type, handler, false);
// IE事件处理程序
}else if(element.attachEvent) {
// 通过attachEvent()添加的事件处理程序都会被添加到冒泡阶段
// 通过attachEvent()添加的匿名函数无法被移除
// 使用attachEvent()方法，事件处理程序会在全局作用域中执行，this对象引用的是window
element.attachEvent(‘on‘ + type, handler);
// DOM0级事件处理程序
}else {
// this对象引用的是当前元素
element[‘on‘ + type] = handler;
}
},
removeHandler: function(element, type, handler) {
if(element.removeEventListener) {
element.removeEventListener(type, handler, false);
}else if(element.detachEvent) {
element.detachEvent(‘on‘ + type, handler);
}else {
element[‘on‘ + type] = null;
}
}
};
var t = document.getElementsByTagName("tag")[0]
EventUtil.addHandler(t, ‘clcik‘, function(){
alert(t.tagName);
})
2、正则，邮箱。
3、从输入URL到浏览器显示页面发生了什么。
一、网络通讯
4.传输层TCP传输报文
4、模拟Object.create()。
5、跨域的方式及其原理
6.1 多行文本垂直居中
6.2 不定宽高图片垂直居中
6.2-2兼容ie6和7
7、HTTP的方法。HTTP头缓存的方式。
8、输出多行，减少DOM重徽，提升性能。不用框架and用框架。
9、移动端调试的方法.
10、js文件管理方式。
11、浏览器如何捕捉到错误。如何发送给服务器。
12、判断是否为数组
Array.isArray([]) true
[] insatanceof Array true
Object.prototype.toString.apply([]) === ‘[Object Array]‘ true
[].constructor === Array true
13、浏览器实现不同标签页之间的通信？
（1）cookie
（2）localStorage
14、
15、JS设置cookie、读取cookie、删除cookie
（1）设置cookie
假设在A页面中要保存变量username的值("jack")到cookie中,key值为name，则相应的JS代码为:
document.cookie = "name = " + username
(2)读取cookie
假设cookie中存储的内容为：name=jack;password=123
则在B页面中获取变量username的值的JS代码如下：
16、CSS:opacity:0,visibility:hidden,display:none的区别？
（1）display:none 元素隐藏，改变页面布局，可以理解成在页面中把该元素删除掉一样。
（2）visibility:hidden 元素隐藏，不改变页面布局，不会触发该元素已经绑定的事件
（3）opacity:0 元素隐藏，不改变页面布局，（比如点击）会触发该元素已经绑定的事件
17、px和em的区别
（1）px： 表示像素，是绝对单位 ，不会因为其他元素的尺寸变化而变化。
（2）em： 表示相对于父元素的字体大小，是相对单位。
18、jQuery属性选择器
$("img[src=‘‘]")
19、jQuery on的直接绑定和事件委托
.on( events [, selector ] [, data ][, handler])
（1）直接绑定：selector 参数为空。如果on()方法的selector 参数为空，它与bind()方法相同——只能绑定页面已有元素的事件。会发生事件冒泡。
（2）事件委托：事件处理程序只会被绑定到当前已被选定的元素上【selector】。
20、使用Webpack提高Vue.js应用的方式
（1）
优化webpack构建速度，总的来说有几个思路：
1 - 优化本身项目结构，模块的引入、拆分、共用
2 - 优化结构路径、让webpack接管的文件能够快速定位
3 - 优化uglify编译速度
4 - 优化webpack本身编译速度
- 开启webpack的cache
- 开启babel-loader的cache
- 指定modules以及配置项目相关的alias
- 配置loader的include和exclude
- 用CommonsChunkPlugin提取公用模块
- 使用DllPlugin和DllReferencePlugin预编译
- 换用happypack多进程构建
- css-loader换成0.14.5版本。
- 换用webpack-uglify-parallel并行压缩代码
面试过程种遇到的面试题
原文：https://www.cnblogs.com/webenjoy/p/12162501.html
