1xx系列：信息性状态码1xx系列的状态码表示服务器已经接收到请求并正在处理，但需要进一步的操作才能完成请求。 100 Continue：表示服务器已经接收到请求的头部，并且客户端应该继续发送请求的主体部分。 101 Switching Protocols：表示服务器已经理解了客户端的请求，并且将切换到不同的协议来完成请求。 2xx系列：成功状态码2xx系列的状态码表示请求已经成功被服务器接收、理解和处理。 200 OK：表示请求已成功，服务器正常处理并返回请求的资源。 201 Created：表示请求已成功，并且服务器创建了新的资源。 202 Accepted：表示服务器已接受请求，但尚未处理完成。 204 No Content：表示请求已成功，但服务器没有返回任何内容。 3xx系列：重定向状态码3xx系列的状态码表示客户端需要进行进一步的操作才能完成请求。 301 Moved Permanently：表示请求的资源已永久移动到新的URL。 302 Found：表示请求的资源已临时移动到新的URL。 304 Not Modified：表示请求的资源未被修改，可以直接使用缓存 ...

优雅降级（Graceful Degradation）：优雅降级是指首先针对最新的浏览器或设备进行开发，利用其提供的最新特性和功能来构建网页。然后，通过检测用户使用的浏览器或设备，如果发现其不支持某些特性或功能，就会提供一个替代方案，以确保网页在旧版本的浏览器或设备上也能够正常显示和使用。这种策略的目标是尽可能地提供最佳的用户体验，但在旧版本浏览器上可能会有一些功能缺失或效果不佳。 渐进增强（Progressive Enhancement）：渐进增强是指首先针对基本的浏览器或设备进行开发，确保网页的核心功能在所有浏览器上都能够正常运行。然后，通过检测用户使用的浏览器或设备，如果发现其支持某些额外的特性或功能，就会逐步增强网页的功能和用户体验。这种策略的目标是确保网页在所有浏览器上都能够正常运行，并逐步提供更多的功能和效果。 总结起来，优雅降级是从高版本向低版本适配，提供替代方案以确保兼容性；而渐进增强是从低版本向高版本适配，逐步增强功能和用户体验。两种策略都是为了在不同浏览器或设备上提供最佳的用户体验。

XML的定义扩展标记语言 (Extensible Markup Language, XML) ，用于标记电子文件使其具有结构性的标记语言，可以用来标记数据、定义数据类型，是一种允许用户对自己的标记语言进行定义的源语言。 XML使用DTD(document type definition)文档类型定义来组织数据；格式统一，跨平台和语言，早已成为业界公认的标准。XML是标准通用标记语言 (SGML) 的子集，非常适合Web传输。XML提供统一的方法来描述和交换独立于应用程序或供应商的结构化数据。 JSON的定义JSON(JavaScript Object Notation)一种轻量级的数据交换格式，具有良好的可读和便于快速编写的特性。可在不同平台之间进行数据交换。JSON采用兼容性很高的、完全独立于语言文本格式，同时也具备类似于C语言的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)体系的行为。这些特性使JSON成为理想的数据交换语言。 区别 编码方面的区别JSON的编码更为清晰且冗余更少些，而XML比较适合于标记文档。JSON网站提供了对 ...

标准盒与怪异盒的区别在于他们的总宽度的计算公式不⼀样。 标准模式下总宽度=width+margin（左右）+padding（左右）border（左右）； 怪异模式下总宽度=width+margin（左右）（就是说width已经包含了padding和border值）。 标准模式下如果定义的DOCTYPE缺失，则在ie6、ie7、ie8下汇触发怪异模式。 当设置为box-sizing:content-box时，将采⽤标准模式解析计算，也是默认模式； 当设置为box-sizing:border-box时，将采⽤怪异模式解析计算；

案例比如现在有一个子盒子和一个父盒子，子盒子和父盒子二者都有点击事件，但是此时，当我们点击子盒子时，只想让子盒子显示点击事件。这里我们就要用到阻止事件冒泡的方法来隔断父盒子的事件显示。我们应该怎样阻断父盒子的点击事件呢？ 可以直接在子盒子内部的点击事件里面添加stopPropagation()方法 代码实现如下所示： son.addEventListener('click',function(e){alert('son');e.stopPropagation();},false) 但是需要注意的是：这个方法也有兼容性问题，在低版本浏览器中（IE 6-8 ）通常是利用事件对象cancelBubble属性来操作的。即直接在相应的点击事件里面添加：e.cancelBubble = true; 优化代码如果我们想要解决这种兼容性问题，就可以采用下述方法： if(e && e.stopPropagation){e.stopPropagation();}else{window.event.ca ...

区别 px像素，相对长度单位。像素px是相对显示器屏幕分辨率而言的。用于元素的边框或者定位。 em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被设置，则相对浏览器的默认字体尺寸。 rem是css3新增的一个相对单位（root ），rem相对于html根元素，这个单位可谓是集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例的调整所有的字体大小，又可以避免字体大小逐层复合的连锁反应。目前基本上市面上主流的的浏览器都是支持的。对于不支持它的浏览器，应对的方法也很简单，就是对多写绝对单位。

Promise Promise 是异步编程的一种解决方案，比传统的解决方案——回调函数和事件——更合理和更强大。所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。 特点： 对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。 一旦状态改变，就不会再变，任何时候都可以得到这个结果。 缺点 无法取消Promise，一旦新建它就会立即执行，无法中途取消。 如果不设置回调函数，Promise内部抛出的错误，不会反应到外部。 当处于pending状态时，无法得知目前进展到哪一个阶段（刚刚开始还是即将完成）。 generator/yield Generator 函数是 ES6 提供的一种异步编程解决方案，语法行为与传统函数完全不同。 语法上首先可以把它理解成，Generator 函数是一个状态机，封装了多个内部状态。 形式上Generator 函数是一个普通函数，但是有两个特征。 function关键字与函数名之间有一个星号 ...

Web标准简单来说可以分为结构、表现、行为。其中结构是由HTML各种标签组成，简单来说就是body里面写入标签是为了页面的结构。表现指的是CSS层叠样式表，通过CSS可以让我们的页面结构标签更具美感。行为指的是页面和用户具有一定的交互，这部分主要由JS组成。W3C，全称：world wide web consortium是一个制定各种标准的非盈利性组织，也叫万维网联盟，标准包括HTML、CSS、ECMAScript等等，web标准的制定有很多好处，比如说： 可以统一开发流程，统一使用标准化开发工具(VSCode、WebStorm、Sublime)，方便多人协作 学习成本降低，只需要学习标准就行，否则就要学习各个浏览器厂商标准 跨平台，方便迁移都不同设备 降低代码维护成本

浏览器的渲染机制 浏览器的渲染机制一般分为以下几个步骤: 处理 HTML 并构建 DOM 树。 处理 CSS 构建 CSSOM 树。 将 DOM 与 CSSOM 合并成一个渲染树。 根据渲染树来布局，计算每个节点的位置。 调用 GPU 绘制，合成图层，显示在屏幕上。 重绘与回流重绘当元素样式的改变不影响布局时，浏览器将使用重绘对元素进行更新，此时由于只需要UI层面的重新像素绘制，因此损耗较少 回流当元素的尺寸、结构或触发某些属性时，浏览器会重新渲染页面，称为回流。此时，浏览器需要重新经过计算，计算后还需要重新页面布局，因此是较重的操作。会触发回流的操作:– 页面初次渲染 – 浏览器窗口大小改变 – 元素尺寸、位置、内容发生改变 – 元素字体大小变化 – 添加或者删除可见的 dom 元素 – 激活 CSS 伪类（例如：:hover） – 查询某些属性或调用某些方法： – clientWidth、clientHeight、clientTop、clientLeft – offsetWidth、offsetHeight、offsetTop、offsetLeft – scrollWidth、s ...

其基础语言不同 XhtmL是基于可扩展标记语言（XmL）。 htmL是基于标准通用标记语言（sgmL）。 语法严格程度不同 XhtmL语法比较严格，存在dtd定义规则。 htmL语法要求比较松散，这样对网页编写者来说，比较方便。 可混合应用不同 XhtmL可以混合各种XmL应用，比如mathmL、sVg。 htmL不能混合其它XmL应用。 大小写敏感度不同 XhtmL对大小写敏感，标准的XhtmL标签应该使用小写。 htmL对大小写不敏感。 公布时间不同 XhtmL是2000年w3c公布发行的。 htmL4.01是1999年w3c推荐标准。