[TOC]
### 1. html5新特性，对它的了解
更多的是一种规范：
* 新特性应该基于 HTML、CSS、DOM 以及 JavaScript。
* 减少对外部插件的需求（比如 Flash）
* 更优秀的错误处理
* 更多取代脚本的标记
* HTML5 应该独立于设备
* 开发进程应对公众透明
新特性包含的有：
* 用于绘画的 canvas 元素
* 用于媒介回放的 video 和 audio 元素
* 对本地离线存储的更好的支持
* 新的特殊内容元素，比如 article、footer、header、nav、section
* 新的表单控件，比如 calendar、date、time、email、url、search
### 2. 前端页面有哪三层分别是什么（HTML css JavaScript 结构 修饰 控制）
**最准确的网页设计思路是把网页分成三个层次，即：结构层、表示层、行为层。**
**网页的结构层**（structural layer）由 HTML 或 XHTML 之类的标记语言负责创建。标签，也就是那些出现在尖括号里的单词，对网页内容的语义含义做出了描述，但这些标签不包含任何关于如何显示有关内容的信息。例如，P 标签表达了这样一种语义：“这是一个文本段。”
**网页的表示层**（presentation layer） 由 CSS 负责创建。 CSS 对“如何显示有关内容”的问题做出了回答。
**网页的行为层**（behavior layer）负责回答“内容应该如何对事件做出反应”这一问题。这是 Javascript 语言和 DOM 主宰的领域。
网页的表示层和行为层总是存在的，即使我们未明确地给出任何具体的指令也是如此。此时， Web 浏览器将把它的默认样式和默认事件处理函数施加在网页的结构层上。例如，浏览器会在呈现“文本段”元素时留出页边距，有些浏览器会在用户把鼠标指针悬停在 某个元素的上方时弹出一个显示着该元素的 title 属性值的提示框，等等。
### 3.对web标准及w3c规范的了解和认识
~~~
W3C对web标准提出了规范化的要求，也就是在实际编程中的一些代码规范
1.对于结构要求：（标签规范可以提高搜索引擎对页面的抓取效率，对SEO很有帮助）
1）。标签字母要小写
2）。标签要闭合
3）。标签不允许随意嵌套
2.对于css和js来说
1）。尽量使用外链css样式表和js脚本。是结构、表现和行为分为三块，符合规范。同时提高页面渲染速度，提高用户的体验。
2）。样式尽量少用行间样式表，使结构与表现分离，标签的id和class等属性命名要做到见文知义，标签越少，加载越快，用户体验提高，代码维护简单，便于改版
3）。不需要变动页面内容，便可提供打印版本而不需要复制内容，提高网站易用性。
~~~
### 4.什么是路由，vue如何实现路由
~~~
1. 路由是根据url的不同显示不同的页面
~~~
#### 1.事件路由
~~~
<button @click="handleClick">跳转到首页</button>
~~~
~~~
methods:{
handleClick(){
this.$router.push('/')
}
}
~~~
#### 2.router-link路由
~~~
<router-link to="/"></router-link>
~~~
### 5. 谈谈document.ready和window.onload的区别
[详解](https://www.kancloud.cn/tjs5945111/jquery/787372)
### 6. 你认为高质量的代码具备哪些特点
~~~
模块化 低耦合 高复用 可维护 可扩展
~~~
### 7. 写一段代码监听该按钮的点击事件
~~~
var btn = document.getElementsByTagName('button');
btn[0].addEventListener('click', function() {
alert('你点击了这个按钮');
}, false);
~~~
~~~
var dd = document.getElementById('id')
dd .removeEventListener('click',function(){
alert('移除事件监听')
});
~~~
### 8. form表单中的action
~~~
action 属性规定当提交表单时，向何处发送表单数据。
~~~
### 9. cooking和session
~~~
1.都是用来存放用户信息的
2. 区别：
① Cookie存放在客户端；Session存放在服务器端；
② Cookie内存小，Session内存大
~~~
### 10. js如何扩展prototype？
~~~
/**
* 创建一个weekday()函数，把它添加到Date对象的原型中去，
* 返回一个字符串，表明当前日期对象是星期几
*/
Date.prototype.weekday=function(){
var day=this.getDay();
var arr=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
return arr[day];
};
~~~
### 11.import和link区别
（1）从属关系区别：
~~~
link属于XHTML标签，除了加载CSS外，还能用于定义RSS，定义rel连接属性等作用；
@import是CSS提供的，用于引入外部文件
~~~
（2）加载顺序区别：
~~~
link标签引入的CSS被同时加载，@import引入的CSS将在页面在在完毕后被加载（耗时）。
~~~
（3）DOM可控性区别：
~~~
可通过JS操作DOM插入link标签改变样式，无法使用@import的方式插入样式。
~~~
### 12. 前端开发性能优化
~~~
1. 压缩css、js文件
2. 合并js、css文件，减少http请求
3. 外部js、css文件放在最底下
4. 减少dom操作，尽可能用变量替代不必要的dom操作
~~~
### 13. js定时器
[详解](http://www.runoob.com/w3cnote/js-timer.html)
js 定时器有以下两个方法：
* setInterval() ：按照指定的周期（以毫秒计）来调用函数或计算表达式。方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。
* setTimeout() ：在指定的毫秒数后调用函数或计算表达式。
### 14. document.wriite和innhtml区别
~~~
主要区别：document.write是直接将内容写入页面的内容流，会导致页面全部重绘，innerHTML将内容写入某个DOM节点，不会导致页面全部重绘
~~~
### 15. 对浏览器内核的理解、有哪些内核
~~~
主要分成两个部分：渲染引擎(Render Engine)和JS引擎。
~~~
1.渲染引擎：
负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入CSS等），以及计算网页的显示方式，然后会输出至显示器或打印机。
浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要内核。
2.JS引擎则：
解析和执行javascript来实现网页的动态效果。
> 最开始渲染引擎和JS引擎并没有区分的很明确，后来JS引擎越来越独立，内核就倾向于只指渲染引擎。
3. 种类
- (1)Trident内核
- (2)Gecko内核
- (3)WebKit内核
- (4)Blink内核
### 16. es6新特性
~~~
1. 使用let申明变量有块级作用域，不能重复声明，没有申明提前
2. 箭头函数，更加简洁并且解决了this的指向问题
3. 解构语法和展开语法默认赋值
4. 类和继承
5. promise ,axios和ajax就是一个promise（定义两个变量用来接收发送的ajax请求 通过promise all触发 通过这个例子可以用来说明 ajax是一个promise）
~~~
### 17.回调函数(在ajax中可以实现代码分离)
~~~
// 回调函数可以将函数内部的值返回到外部使用，剥夺了函数return的能力(函数传参可以传函数)
var go=function(back){
var a=1;
back:test(a)
}
function test(a){
console.log(a)
//1
}
go(test)
~~~
### 18.使用[transform](https://www.cnblogs.com/shenfangfang/p/5714687.html)时使用哪个属性改变中心点
~~~
transform-origin: center bottom
~~~
