1、对WEB标准以及W3C的理解和认识？
- 标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率
- 使用外链css和js脚本，结构行为表现的分离
- 文件下载与页面速度更快，内容能被更多的用户所访问，内容能被更广泛的设备所访问
- 更少的代码和组价，容易维护，改版方便，不需要变动页面内容
- 提供打印版本而不需要复制内容、提高网站易用性。
2、xml和html有什么区别
- HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言
- 最主要的不同是：
- XHTML元素必须被正确地嵌套
- XHTML元素必须被关闭
- 标签名必须用小写
- XHTML文档必须拥有根元素
3、doctype（文档类型）的作用是什么？你知道多少种文档类型？
作用是：此标签可以告知浏览器文档使用哪种HTML或XHTML规范
此标签可声明三种DTD类型，分别表示严格版本、过渡版本以及基于框架的HTML文档
- HTML4.01规定了三种文档类型：Strict、Transition以及Frameset
- XHTML1.0 规定了三种XML文档类型：Strict、Transitional以及Frameset
- Standards（标准）模式（也就是严格呈现模式）用于呈现遵循最新标准的网页，而Quirks（包容）模式（也就是松散呈现模式或者兼容模式）用于呈现为传统浏览器而设计的网页
4、行内元素有哪些？块级元素有哪些？CSS的盒模型
- 行内元素：span、a、Img、input、select、b
- 块级元素：div、p、h1~h6、form、ul、li
- CSS盒模型：border、padding、margin
5、CSS引入方式有哪些？link和@import的区别
- CSS引入方式：内联式、行内式、外链式
- 区别是：同时加载
- 前者无兼容性、后者CSS2.1以下的浏览器不支持
- link支持使用JavaScript改变样式，后者不支持
6、CSS选择器有哪些？哪些属性可以继承？优先级算法如何计算？内联和important哪个优先级高？
- CSS选择器：标签选择器、类选择器、ID选择器（组合选择器、相邻选择器（+））伪类选择器
- 继承不如指定
- 优先级：标签选择器<类选择器<ID选择器
- important优先级高
7、前端页面有哪三层构成，分别是什么？作用是什么？
- 结构层html、表现层css、行为层js
8、CSS的基本语句构成是？
- 选择器{属性名：属性值；属性名：属性值；}
9、你做的页面在哪些浏览器测试过？这些浏览器的内核是什么
- IE（ie内核）、谷歌（webkit内核）、火狐（Gecko）、opera（Presto）
10、写出几种IE6 BUG的解决方法
- float引起的双边距bug：使用display
- 使用float引起的3像素bug：使用display:inline
- 超链接hover点击之后失效：使用正确的书写顺序link visited hover active
- IE z-inde问题：给父级添加position:relative
- PNG透明：使用js代码改
- min-height最小高度 !important解决
- select在ie6下遮盖 使用iframe嵌套
- 为什么没有办法定义1px左右的宽度容器（IE6默认的行高造成的，使用over:hidden;zoom:0.09;line-height:1px;）
- IE6不支持!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
- 语义化HTML就是：标题h1~h6，段落p，无序列表ul li，有序列表ol li，图片img，链接a等，对于搜索引擎的抓取有好处
语义化的好处：
- 去掉或样式丢失的时候，能让页面呈现清晰的结构
- 屏幕阅读器（如果访客有视障）会完全根据你的标记来"读"你的网页
- PDA、手机登设备可能无法像普通电脑的浏览器一样来渲染网页（通常是因为这些设备对CSS的支持较弱）
- 搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重
- 你的页面是否对爬虫容易理解非常重要，因为爬虫很大程度上会忽略用于表现的标记，而只注重语义化标记。
- 便于团队开发和维护
17、清除浮动的几种方式，各自的优缺点
- 使用空标签清除浮动clear:both（理论上能清除任何标签，，，增加无意义的标签）
- 使用overflow:auto（空标签元素清除浮动而不是增加无意代码的弊端，使用zoom:1用于兼容IE）
- 使用after伪元素清除浮动（用于非IE浏览器）
18、请说出三种减少页面加载时间的方法。（加载时间指感知的时间或者实际加载时间）
- 优化图片
- 图片格式的选择（GIF：提供的颜色较少，可用在一些对颜色要求不高的地方）
- 优化CSS（压缩合并css，如margin-top，margin-left...）
- 网址后加斜杠（如：www.campr.com/目录，会判断这个"目录是什么文件类型，或者是目录。"）
- 标明高度和宽度（如果浏览器没有找到这两个参数，它需要一边下载图片，一边计算大小，如果图片很多，浏览器需要不断的调整页面，这不但影响速度，也影响浏览体验，当浏览器知道了高度和宽度参数后，即使图片暂时无法显示，页面上也会腾出图片的空位，然后继续加载后面的内容，从而使加载时间变快，浏览体验也更好）
- 减少http请求（合并文件，合并图片使用雪碧图）
19、讨论CSS hacks，条件引用或者其他
- <!--[if IE6]--><![end if]-->
- _margin IE6
- +margin IE7
- margin:0 auto9 所有IE
- margin: IE8
20、你用过媒体查询，或者针对移动端的布局/CSS吗？
- @media screen and (min-400px) and (max-700px){......}
- @media handheld and (min-20em)，screen and (min-20em){......}
- 媒体查询，就是响应式布局，响应式布局框架：bootstrap、PureCSS等
21、解释下原型继承的原理
当查找一个对象的属性时，JavaScript会向上遍历原型链，直到找到给定名称的属性为止（大多数JavaScript的实现用_proto_属性来表示一个对象的原型链）
以下代码展示了JS引擎如何查找属性：
function getProperty(obj,prop){
if(obj.hasOwnProperty(prop)){
return obj[prop];
}else if(obj._proto_! == null){
return getProperty(obj._proto_，prop)
}else{
return undefined;
}
}
22、前端安全
CSRF:跨站请求伪造。攻击者盗用了你的身份，以你的名义发送恶意请求。他可以做到的事情包括：以你的名义发送邮件，发消息，盗取你的账号。甚至购买商品...造成的问题包括：个人隐私泄露以及财产安全。
原理：
登录受信任的网站A，并且在本地生成cookie，在不登录A网站的情况下，访问危险网站B
常见类型：
- 使用get更新请求资源，容易在B使用img标签造成攻击
- 前端虽然改成了post请求，但是B网站通过iframe等手段同样造成了攻击
防御机制：
- 验证码：用户每次提交都需要在表单中填写图片上一个随机字符串
- 添加一个隐藏的输入框：包含token，服务端验证是否匹配
- 使用HTTP refer头部进行判断，如果不是业务域名发起的HTTP请求，直接过滤。
XSS它的全名：Cross-sitescripting，为了和CSS层叠样式表区分所以取名XSS是一种网站应用程序的安全漏洞攻击，是代码注入的一种。它允许恶意用户将代码注入到网页上，这类攻击通常包含了HTML以及用户端脚本语言。
23、CMD VS AMD
CommonJS是服务器端模块的规范，Node.js采用了这个规范
- 根据CommonJS规范，一个单独的文件就是一个模块。每一个模块都是一个单独的作用域，也就是说，在该模块内部定义的变量，无法被其他模块读取，除非定义为globald对象的属性。
- CommonJS规范加载模块是同步的，也就是说，只要加载完成，才能执行后面的操作。
AMD规范则是非同步加载模块，允许指定回调函数。
- 由于Node.js主要用于服务器编程，模块文件一般都已经存在于本地硬盘，所以加载起来比较快，不用考虑非同步加载的方式，所以CommonJS规范比较适用。
- 但是，如果是浏览器环境，要从服务器端加载模块，这时就必须采用非同步模式，因此浏览器一般采用AMD规范。