持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第3天，点击查看活动详情
dom 节点的Attribute 和Property 有何区别？
1、什么是 Property
每 个 DOM 节点都是一个 object 对象，有自己的 property 和 method
原则上 property 应该仅供 js 操作， 不会出现在 html 中（ 默认属性除外： id/src/href/className/dir/title/lang 等），和其他 js object 一样，自定义的 property 也会出现在 object 的 for…in 遍历中
2、什么是 Attribute
attribute 出现 在 dom 中，js 提供了 getAttribute/setAttribute 等方法来获取和改变它的值，最后作用于 html 中，可以影响 innerHTML 获取的值。可以通过访问 dom 节点的 attributes属性来获取 改节点的所有的 attribute。（在 IE<9 中,attribute 获取和改变的实际上是 property。）
3、两者之间的区别是
3.1）自定义的 Property 与Attribute 不同步,不相等 3.2）非自定义的 DOM property 与 attributes 是有条件同步的
3.3）非自定义的属性(id/src/href/name/value 等)，通过 setAttribute 修改其特 性值可以同步作用到 property 上，而通过.property 修改属性值有的(value)时候不会同步到 attribute 上，即不会反应到 html 上(除以下几种情况，非自定义属性 在二者之间是同步的)。
src 和href 的区别是？
区别
src（source）指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置； 在 请求 src 资源时会将其指向的资源下载并应用到文档中，如 JavaScript 脚本，img 图
片和 iframe 等元素
当浏览器解析到该元素时，会暂停其他资源的下载和处理，直到将该资源加载、编译、执行完毕，类似于将所指向资源嵌入当前标签内
href（hypertext reference/超文本引用）指向网络资源所在位置，建立和当前元素（锚点）或 当 前 文 档 （ 链 接 ） 之 间 的 链 接 ， 如 果 我 们 在 文 档 中 添 加
<link href="common.css"rel="stylesheet"/>那么浏览器会识别该文档为 CSS 文件，就会并行下载资源并且不会停止对当前文档的处理
JavaScript 动画和CSS3 动画有什么区别？
1、CSS 动画优点：
1.1) 浏览器可以对动画进行优化。
1.1.1 )浏览器使用 requestAnimationFrame 比起 setTimeout，setInterval 设置动画的优势主要是:
1) requestAnimationFrame 会把每一帧中的所有 DOM 操作集中起来，在一次重绘或回流中就完成,并且重绘或回流的时间间隔紧紧跟随浏览器的刷新频率,一般来说,这个频率为每秒 60 帧。
2) 在隐藏或不可见的元素中 requestAnimationFrame 不会进行重绘或回流，这当然就意味着更少的的 cpu，gpu 和内存使用量。
1.1.2) 强制使用硬件加速 （通过 GPU 来提高动画性能） 1.2)代码相对简单,性能调优方向固定
1.3)对于帧速表现不好的低版本浏览器，CSS3 可以做到自然降级，而 JS 则需要撰写额外代码
CSS 动画缺点：
1.1) 运行过程控制较弱,无法附加事件绑定回调函数。CSS 动画只能暂停,不能在动画中寻找一个特定的时间点，不能在半路反转动画，不能变换时间尺度，不能在特定的位置添加回调函数或是绑定回放事件,无进度报告。
1.2) 代码冗长。想用 CSS 实现稍微复杂一点动画,最后 CSS 代码都会变得非常笨重。 2、JS 动画
2、js动画的优点：
2.1）JavaScript 动画控制能力很强, 可以在动画播放过程中对动画进行控制：开始、暂停、回放、终止、取消都是可以做到的。 2.2）动画效果比 css3 动画丰富,有些动画效果，比如曲线运动,冲击闪烁,视差滚动效果，只有 JavaScript 动画才能完成。
2.3）CSS3 有兼容性问题，而 JS 大多时候没有兼容性问题。缺点：
2.1 ） JavaScript 在浏览器的主线程中运行，而主线程中还有其它需要运行的 JavaScript 脚本、样式计算、布局、绘制任务等,对其干扰导致线程可能出现阻塞，从而造成丢帧的情况。
2.2）代码的复杂度高于 CSS 动画 3、css 动画和 js 动画的差异
js动画的缺点：
3.1）代码复杂度，js 动画代码相对复杂一些 。
3.2）动画运行时，对动画的控制程度上，js 能够让动画，暂停，取消，终止，css 动画不能添加事件。
3.3）动画性能看，js 动画多了一个 js 解析的过程，性能不如 css 动画好。总结：
简单的状态切换，不需要中间过程控制，css 动画是优选方案。复杂的状态的 APP。应该使用 js 动画
