1.在性能上会稍微好一些，浏览器会对CSS3的动画做一些优化（比如专门新建一个图层用来跑动画）
2.代码相对简单
但其缺点也很明显：
1.在动画控制上不够灵活
2.兼容性不好
3.部分动画功能无法实现（如滚动动画，视差滚动等）
JavaScript的动画正好弥补了这两个缺点，控制能力很强，可以单帧的控制、变换，同时写得好完全可以兼容IE6，并且功能强大。但想想CSS动画的transform矩阵是C++级的计算，必然要比javascript级的计算要快。另外对库的依赖也是一个很让人头疼的问题。
所以，对于一些复杂控制的动画，使用javascript会比较靠谱。而在实现一些小的交互动效的时候，就多考虑考虑CSS吧。
61.作用域的分类
参考答案：块作用域、词法作用域、动态作用域
解析：
1 块作用域 花括号 {}
2 词法作用域（js 属于词法作用域） 作用域只跟在何处被创建有关系，跟在何处被调用没有关系
3 动态作用域 作用域只跟在何处被调用有关系，跟在何处被创建没有关系
参与互动
62.js 属于哪种作用域
参考答案：词法作用域（函数作用域）
解析：
参与互动
63.浮点数精度
参考答案：参考
参与互动
64.自执行函数? 用于什么场景？好处?
参考答案：
好处：防止变量弥散到全局，以免各种 js 库冲突。隔离作用域避免污染，或者截断作用域链，避免闭包造成引用变量无法释放。利用立即执行特性，返回需要的业务函数或对象，避免每次通过条件判断来处理
场景：一般用于框架、插件等场景
参与互动
65.多个页面之间如何进行通信
参考答案：有如下几个方式：
参与互动
66.css 动画和 js 动画的差异
参考答案：
1.代码复杂度，js 动画代码相对复杂一些 2.动画运行时，对动画的控制程度上，js 能够让动画，暂停，取消，终止，css 动画不能添加事件 3.动画性能看，js 动画多了一个 js 解析的过程，性能不如 css 动画好
解析：参考
参与互动
67.如何做到修改 url 参数页面不刷新
参考答案：
HTML5 引入了 history.pushState() 和 history.replaceState() 方法，它们分别可以添加和修改 历史 记录条目。
假设当前页面为 foo.html ，执行上述代码后会变为 bar.html ，点击浏览器后退，会变为 foo.html ，但浏览器并不会刷新。 pushState() 需要三个参数: 一个状态对象, 一个标题 (目前被忽略), 和 (可选的) 一个 URL.让我们来解释下这三个参数详细内容：
参与互动
68.数组方法 pop() push() unshift() shift()
参考答案：
参与互动
69.事件绑定与普通事件有什么区别
参考答案：
参与互动
70.IE 和 DOM 事件流的区别
参考答案：
1.事件流的区别
IE 采用冒泡型事件 Netscape 使用捕获型事件 DOM 使用先捕获后冒泡型事件 示例：
复制代码代码如下:
冒泡型事件模型： button->p->body (IE 事件流)
捕获型事件模型： body->p->button (Netscape 事件流)
DOM 事件模型： body->p->button->button->p->body (先捕获后冒泡)
2.事件侦听函数的区别
IE 使用:
DOM 使用：
bCapture 参数用于设置事件绑定的阶段，true 为捕获阶段，false 为冒泡阶段。
参与互动
简单的不用js就行
<!DOCTYPE HTML><html>
<head>
<meta charset= "utf8">
<title>untitled</title>
<link rel = "stylesheet" type = "text/css" href = "">
<style type = "text/css">
*{
margin: 0px
padding: 0px
}
#a{
position: absolute
width: 50px
height: 50px
background-color: #f3e9e0
border-radius: 50%
left: 400px
top: 200px
}
#a div{
position: absolute
width: 50px
height: 50px
border-radius: 50%
transition: all 0.5s
left: 0px
top: 0px
}
#a :nth-child(1){
background-color: #c1d4ed
}
#a :nth-child(2){
background-color: #7d6e69
}
#a :nth-child(3){
background-color: #dad6d5
}
#a :nth-child(4){
background-color: #caaa9d
}
#a :nth-child(5){
background-color: #6bdeff
}
#a:hover :nth-child(1){
left: 150px
top: -150px
}
#a:hover :nth-child(2){
left: 150px
top: 150px
}
#a:hover :nth-child(3){
left: 300px
top: -150px
}
#a:hover :nth-child(4){
left: 300px
top: 150px
}
#a:hover :nth-child(5){
left: 450px
top: 0px
}
</style>
</head>
<body>
<div id = 'a'>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>
鼠标伸到球上 自动扩散移动
