JavaScript 的简介 JavaScript（通常缩写为JS）是一种高级的、解释型的编程语言。JavaScript是一门基于原型、函数先行的语言，是一门多范式的语言，它支持面向对象编程，命令式编程，以及函数式编程。 历史 1995年，网景招募了布兰登·艾克，目标是把Scheme语言嵌入到Netscape Navigator浏览器当中。但更早之前，网景已经跟昇阳合作在Netscape Navigator中支持Java，这时网景内部产生激烈的争论。后来网景决定发明一种与Java搭配使用的辅助脚本语言并且语法上有些类似，这个决策导致排除了采用现有的语言，例如Perl、Python、Tcl或Scheme。为了在其他竞争提案中捍卫JavaScript这个想法，公司需要有一个可以运作的原型。艾克在1995年5月仅花了十天时间就把原型设计出来了。 最初命名为Mocha，1995年9月在Netscape Navigator 2.0的Beta版中改名为LiveScript，同年12月，Netscape Navigator 2.0 Beta 3中部署时被重命名为JavaScript，当时网景公司与昇阳电脑公司组成的开发联盟为了让这门语言搭上Java这个编程语言“热词”，因此将其临时改名为JavaScript，日后这成为大众对这门语言有诸多误解的原因之一。 微软采纳 JavaScript推出后在浏览器上大获成功，微软公司在不久后就为Internet Explorer 3浏览器推出了JScript，以与处于市场领导地位的网景产品同台竞争。JScript也是一种JavaScript实现，这两个JavaScript语言版本在浏览器端共存意味着语言标准化的缺失，发展初期，JavaScript的标准并未确定，同期有网景的JavaScript，微软的JScript双峰并峙。除此之外，微软也在网页技术上加入了不少专属对象，使不少网页使用非微软平台及浏览器无法正常显示，导致在浏览器大战期间网页设计者通常会把“用Netscape可达到最佳效果”或“用IE可达到最佳效果”的标志放在主页。随着Internet Explorer 4的发布，微软引入了动态HTML的概念，但语言实现和不同专有化的文档对象模型的差异仍然存在，成为网络上普及使用JavaScript的阻碍。 标准化 1996年11月，网景正式向ECMA（欧洲计算机制造商协会）提交语言标准。1997年6月，ECMA以JavaScript语言为基础制定了ECMAScript标准规范ECMA-262。JavaScript成为了ECMAScript最著名的实现之一。

URL的简单基础知识 URL 包含哪几部分 URL 全称是Union Resource Location，包括了： 协议 域名 端口 路径 查询参数 锚点 协议 网络协议是通信计算机双方必须共同遵从的一组约定，常用的有TCP/IP，基于此封装的上层协议有HTTP/HTTPS 域名 IP的别称 端口 一台机器提供的不同服务 路径 访问资源在服务器的地址路径 查询参数 访问资源的自定义选择参数 锚点 前端显示的资源定位，不传给服务器 DNS DNS 全称是Domain Name Server，域名解析服务，使用 nslookup 命令可以查到DNS记录的生存时间还可以指定使用哪个DNS服务器进行解释 IP 功能是 定位一台设备 封装数据报文，跟其他设备交流 域名 IP与域名的关系 一个域名可以对应不同的IP 负载均衡，防止一台机器扛不住 一个IP可以对应不同域名 共享主机，资源不足才这么使用 加了www的域名 www.域名和域名不是同一个域名，比如：com是顶级域名，域名.com是一级域名，www.域名.com 二级域名

这篇主要介绍浏览器的渲染原理和CSS动画。 浏览器渲染原理 渲染树构建、布局及绘制 整个过程可以概括为根据 HTML 和 CSS 输入构建了 DOM 树和 CSSOM 树，再将CSSOM 树和 DOM 树合并成渲染树，然后用于计算每个可见元素的布局，并输出给绘制流程，将像素渲染到屏幕上。 简要概述了浏览器完成的步骤： 处理 HTML 标记并构建 DOM 树。 处理 CSS 标记并构建 CSSOM 树。 将 DOM 与 CSSOM 合并成一个渲染树。 根据渲染树来Layout布局（文档流、盒模型、计算大小和位置），以计算每个节点的几何信息。 Paint绘制（把边框颜色、文字颜色、阴影等画出来）。 Compose合成（根据层叠关系展示画面）到屏幕上。 关于DOM 和 CSSOM 合并成一个“渲染树”，浏览器大体上完成了下列工作： 从 DOM 树的根节点开始遍历每个可见节点。 某些节点不可见（例如脚本标记、元标记等），因为它们不会体现在渲染输出中，所以会被忽略。 某些节点通过 CSS 隐藏，因此在渲染树中也会被忽略。 对于每个可见节点，为其找到适配的 CSSOM 规则并应用它们。 发射可见节点，连同其内容和计算的样式。 关于“布局”阶段 合并成一个“渲染树”的过程是计算了哪些节点应该是可见的以及它们的计算样式，但我们尚未计算它们在设备视口内的确切位置和大小—这就是“布局”阶段，也称为“自动重排”。 布局流程的输出是一个“盒模型”，它会精确地捕获每个元素在视口内的确切位置和尺寸：所有相对测量值都转换为屏幕上的绝对像素。 关于“绘制”阶段 将渲染树中的每个节点转换成屏幕上的实际像素。这一步通常称为“绘制”或“栅格化”。 执行渲染树构建、布局和绘制所需的时间将取决于文档大小、应用的样式，以及运行文档的设备：文档越大，浏览器需要完成的工作就越多；样式越复杂，绘制需要的时间就越长（例如，单色的绘制开销“较小”，而阴影的计算和渲染开销则要“大得多”）。 注意点： visibility: hidden 与 display: none 是不一样的。前者隐藏元素，但元素仍占据着布局空间（即将其渲染成一个空框），而后者 (display: none) 将元素从渲染树中完全移除，元素既不可见，也不是布局的组成部分。 渲染树只包含渲染网页所需的节点。 布局更新样式包含布局、绘制、合成，布局和绘制有可能被忽略。 CSS 动画 主要方式有三种：