PWA应用过吗？serviceWorker的应用原理是啥？

渐进式网络应用（PWA）是谷歌在2015年底提出的概念。基本上算是web应用程序，但在外观和感觉上与原生app相似。反对PWA的网站能够提供脱机工作、推送告诉和设施硬件拜访等性能。

Service Worker是浏览器在后盾独立于网页运行的脚本，它关上了通向不须要网页或用户交互的性能的大门。 当初，它们已包含如推送告诉和后盾同步等性能。 未来，Service Worker将会反对如定期同步或天文围栏等其余性能。 本教程探讨的外围性能是拦挡和解决网络申请，包含通过程序来治理缓存中的响应。

事件触发的过程是怎么的

事件触发有三个阶段：

  • window 往事件触发处流传，遇到注册的捕捉事件会触发
  • 流传到事件触发处时触发注册的事件
  • 从事件触发处往 window 流传，遇到注册的冒泡事件会触发

事件触发一般来说会依照下面的程序进行，然而也有特例，如果给一个 body 中的子节点同时注册冒泡和捕捉事件，事件触发会依照注册的程序执行。

// 以下会先打印冒泡而后是捕捉node.addEventListener(  'click',  event => {    console.log('冒泡')  },  false)node.addEventListener(  'click',  event => {    console.log('捕捉 ')  },  true)

通常应用 addEventListener 注册事件，该函数的第三个参数能够是布尔值，也能够是对象。对于布尔值 useCapture 参数来说，该参数默认值为 false ，useCapture 决定了注册的事件是捕捉事件还是冒泡事件。对于对象参数来说，能够应用以下几个属性：

  • capture：布尔值，和 useCapture 作用一样
  • once：布尔值，值为 true 示意该回调只会调用一次，调用后会移除监听
  • passive：布尔值，示意永远不会调用 preventDefault

一般来说，如果只心愿事件只触发在指标上，这时候能够应用 stopPropagation 来阻止事件的进一步流传。通常认为 stopPropagation 是用来阻止事件冒泡的，其实该函数也能够阻止捕捉事件。

stopImmediatePropagation 同样也能实现阻止事件，然而还能阻止该事件指标执行别的注册事件。

node.addEventListener(  'click',  event => {    event.stopImmediatePropagation()    console.log('冒泡')  },  false)// 点击 node 只会执行下面的函数，该函数不会执行node.addEventListener(  'click',  event => {    console.log('捕捉 ')  },  true)

HTTP/1.0 HTTP1.1 HTTP2.0版本之间的差别

  • HTTP 0.9 ：1991年,原型版本，性能简陋，只有一个命令GET,只反对纯文本内容，该版本已过期。

  • HTTP 1.0

    • 任何格局的内容都能够发送，这使得互联网不仅能够传输文字，还能传输图像、视频、二进制等文件。
    • 除了GET命令，还引入了POST命令和HEAD命令。
    • http申请和回应的格局扭转，除了数据局部，每次通信都必须包含头信息（HTTP header），用来形容一些元数据。
    • 只应用 header 中的 If-Modified-Since 和 Expires 作为缓存生效的规范。
    • 不反对断点续传，也就是说，每次都会传送全副的页面和数据。
    • 通常每台计算机只能绑定一个 IP，所以申请音讯中的 URL 并没有传递主机名（hostname）

  • HTTP 1.1 http1.1是目前最为支流的http协定版本，从1999年公布至今，仍是支流的http协定版本。

    • 引入了长久连贯（ persistent connection），即TCP连贯默认不敞开，能够被多个申请复用，不必申明Connection: keep-alive。长连贯的连贯时长能够通过申请头中的 keep-alive 来设置
    • 引入了管道机制（ pipelining），即在同一个TCP连贯里，客户端能够同时发送多个 申请，进一步改良了HTTP协定的效率。
    • HTTP 1.1 中新减少了 E-tag，If-Unmodified-Since, If-Match, If-None-Match 等缓存管制标头来管制缓存生效。
    • 反对断点续传，通过应用申请头中的 Range 来实现。
    • 应用了虚构网络，在一台物理服务器上能够存在多个虚拟主机（Multi-homed Web Servers），并且它们共享一个IP地址。
    • 新增办法：PUT、 PATCH、 OPTIONS、 DELETE。

  • http1.x版本问题

    • 在传输数据过程中，所有内容都是明文，客户端和服务器端都无奈验证对方的身份，无奈保证数据的安全性。
    • HTTP/1.1 版本默认容许复用TCP连贯，然而在同一个TCP连贯里，所有数据通信是按秩序进行的，服务器通常在解决完一个回应后，才会持续去解决下一个，这样子就会造成队头阻塞。
    • http/1.x 版本反对Keep-alive，用此计划来补救创立屡次连贯产生的提早，然而同样会给服务器带来压力，并且的话，对于单文件被一直申请的服务，Keep-alive会极大影响性能，因为它在文件被申请之后还放弃了不必要的连贯很长时间。

  • HTTP 2.0

    • 二进制分帧 这是一次彻底的二进制协定，头信息和数据体都是二进制，并且统称为"帧"：头信息帧和数据帧。
    • 头部压缩 HTTP 1.1版本会呈现 User-Agent、Cookie、Accept、Server、Range 等字段可能会占用几百甚至几千字节，而 Body 却常常只有几十字节，所以导致头部并重。HTTP 2.0 应用 HPACK 算法进行压缩。
    • 多路复用 复用TCP连贯，在一个连贯里，客户端和浏览器都能够同时发送多个申请或回应，且不必按程序一一对应，这样子解决了队头阻塞的问题。
    • 服务器推送 容许服务器未经请求，被动向客户端发送资源，即服务器推送。
    • 申请优先级 能够设置数据帧的优先级，让服务端先解决重要资源，优化用户体验。

死锁产生的起因？ 如果解决死锁的问题？

所谓死锁，是指多个过程在运行过程中因抢夺资源而造成的一种僵局，当过程处于这种僵持状态时，若无外力作用，它们都将无奈再向前推动。

零碎中的资源能够分为两类：

  • 可剥夺资源，是指某过程在取得这类资源后，该资源能够再被其余过程或零碎剥夺，CPU和主存均属于可剥夺性资源；
  • 不可剥夺资源，当零碎把这类资源分配给某过程后，再不能强行发出，只能在过程用完后自行开释，如磁带机、打印机等。

产生死锁的起因：

（1）竞争资源

  • 产生死锁中的竞争资源之一指的是竞争不可剥夺资源（例如：零碎中只有一台打印机，可供过程P1应用，假设P1已占用了打印机，若P2持续要求打印机打印将阻塞）
  • 产生死锁中的竞争资源另外一种资源指的是竞争长期资源（长期资源包含硬件中断、信号、音讯、缓冲区内的音讯等），通常音讯通信程序进行不当，则会产生死锁

（2）过程间推动程序非法

若P1放弃了资源R1，P2放弃了资源R2，零碎处于不平安状态，因为这两个过程再向前推动，便可能产生死锁。例如，当P1运行到P1：Request（R2）时，将因R2已被P2占用而阻塞；当P2运行到P2：Request（R1）时，也将因R1已被P1占用而阻塞，于是产生过程死锁

产生死锁的必要条件：

  • 互斥条件：过程要求对所调配的资源进行排它性管制，即在一段时间内某资源仅为一过程所占用。
  • 申请和放弃条件：当过程因申请资源而阻塞时，对已取得的资源放弃不放。
  • 不剥夺条件：过程已取得的资源在未应用完之前，不能剥夺，只能在应用完时由本人开释。
  • 环路期待条件：在产生死锁时，必然存在一个过程——资源的环形链。

预防死锁的办法：

  • 资源一次性调配：一次性调配所有资源，这样就不会再有申请了（毁坏申请条件）
  • 只有有一个资源得不到调配，也不给这个过程调配其余的资源（毁坏请放弃条件）
  • 可剥夺资源：即当某过程取得了局部资源，但得不到其它资源，则开释已占有的资源（毁坏不可剥夺条件）
  • 资源有序调配法：零碎给每类资源赋予一个编号，每一个过程按编号递增的程序申请资源，开释则相同（毁坏环路期待条件）

代码输入后果

var x = 3;var y = 4;var obj = {    x: 1,    y: 6,    getX: function() {        var x = 5;        return function() {            return this.x;        }();    },    getY: function() {        var y = 7;        return this.y;    }}console.log(obj.getX()) // 3console.log(obj.getY()) // 6

输入后果：3 6

解析：

  1. 咱们晓得，匿名函数的this是指向全局对象的，所以this指向window，会打印出3；
  2. getY是由obj调用的，所以其this指向的是obj对象，会打印出6。

如何进攻 CSRF 攻打？

CSRF 攻打能够应用以下办法来防护：

  • 进行同源检测，服务器依据 http 申请头中 origin 或者 referer 信息来判断申请是否为容许拜访的站点，从而对申请进行过滤。当 origin 或者 referer 信息都不存在的时候，间接阻止申请。这种形式的毛病是有些状况下 referer 能够被伪造，同时还会把搜索引擎的链接也给屏蔽了。所以个别网站会容许搜索引擎的页面申请，然而相应的页面申请这种申请形式也可能被攻击者给利用。（Referer 字段会通知服务器该网页是从哪个页面链接过去的）
  • 应用 CSRF Token 进行验证，服务器向用户返回一个随机数 Token ，当网站再次发动申请时，在申请参数中退出服务器端返回的 token ，而后服务器对这个 token 进行验证。这种办法解决了应用 cookie 繁多验证形式时，可能会被冒用的问题，然而这种办法存在一个毛病就是，咱们须要给网站中的所有申请都增加上这个 token，操作比拟繁琐。还有一个问题是个别不会只有一台网站服务器，如果申请通过负载平衡转移到了其余的服务器，然而这个服务器的 session 中没有保留这个 token 的话，就没有方法验证了。这种状况能够通过扭转 token 的构建形式来解决。
  • 对 Cookie 进行双重验证，服务器在用户拜访网站页面时，向申请域名注入一个Cookie，内容为随机字符串，而后当用户再次向服务器发送申请的时候，从 cookie 中取出这个字符串，增加到 URL 参数中，而后服务器通过对 cookie 中的数据和参数中的数据进行比拟，来进行验证。应用这种形式是利用了攻击者只能利用 cookie，然而不能拜访获取 cookie 的特点。并且这种办法比 CSRF Token 的办法更加不便，并且不波及到分布式拜访的问题。这种办法的毛病是如果网站存在 XSS 破绽的，那么这种形式会生效。同时这种形式不能做到子域名的隔离。
  • 在设置 cookie 属性的时候设置 Samesite ，限度 cookie 不能作为被第三方应用，从而能够防止被攻击者利用。Samesite 一共有两种模式，一种是严格模式，在严格模式下 cookie 在任何状况下都不可能作为第三方 Cookie 应用，在宽松模式下，cookie 能够被申请是 GET 申请，且会产生页面跳转的申请所应用。

参考 前端进阶面试题具体解答

Cookie、LocalStorage、SessionStorage区别

浏览器端罕用的存储技术是 cookie 、localStorage 和 sessionStorage。

  • cookie： 其实最开始是服务器端用于记录用户状态的一种形式，由服务器设置，在客户端存储，而后每次发动同源申请时，发送给服务器端。cookie 最多能存储 4 k 数据，它的生存工夫由 expires 属性指定，并且 cookie 只能被同源的页面访问共享。
  • sessionStorage： html5 提供的一种浏览器本地存储的办法，它借鉴了服务器端 session 的概念，代表的是一次会话中所保留的数据。它个别可能存储 5M 或者更大的数据，它在以后窗口敞开后就生效了，并且 sessionStorage 只能被同一个窗口的同源页面所访问共享。
  • localStorage： html5 提供的一种浏览器本地存储的办法，它个别也可能存储 5M 或者更大的数据。它和 sessionStorage 不同的是，除非手动删除它，否则它不会生效，并且 localStorage 也只能被同源页面所访问共享。

下面几种形式都是存储大量数据的时候的存储形式，当须要在本地存储大量数据的时候，咱们能够应用浏览器的 indexDB 这是浏览器提供的一种本地的数据库存储机制。它不是关系型数据库，它外部采纳对象仓库的模式存储数据，它更靠近 NoSQL 数据库。

代码输入后果

const promise = new Promise((resolve, reject) => {  console.log(1);  setTimeout(() => {    console.log("timerStart");    resolve("success");    console.log("timerEnd");  }, 0);  console.log(2);});promise.then((res) => {  console.log(res);});console.log(4);

输入后果如下：

124timerStarttimerEndsuccess

代码执行过程如下：

  • 首先遇到Promise构造函数，会先执行外面的内容，打印1；
  • 遇到定时器steTimeout，它是一个宏工作，放入宏工作队列；
  • 持续向下执行，打印出2；
  • 因为Promise的状态此时还是pending，所以promise.then先不执行；
  • 继续执行上面的同步工作，打印出4；
  • 此时微工作队列没有工作，继续执行下一轮宏工作，执行steTimeout；
  • 首先执行timerStart，而后遇到了resolve，将promise的状态改为resolved且保留后果并将之前的promise.then推入微工作队列，再执行timerEnd；
  • 执行完这个宏工作，就去执行微工作promise.then，打印出resolve的后果。

如何对我的项目中的图片进行优化？

  1. 不必图片。很多时候会应用到很多润饰类图片，其实这类润饰图片齐全能够用 CSS 去代替。
  2. 对于挪动端来说，屏幕宽度就那么点，齐全没有必要去加载原图节约带宽。个别图片都用 CDN 加载，能够计算出适配屏幕的宽度，而后去申请相应裁剪好的图片。
  3. 小图应用 base64 格局
  4. 将多个图标文件整合到一张图片中（雪碧图）

  5. 抉择正确的图片格式：

    • 对于可能显示 WebP 格局的浏览器尽量应用 WebP 格局。因为 WebP 格局具备更好的图像数据压缩算法，能带来更小的图片体积，而且领有肉眼辨认无差别的图像品质，毛病就是兼容性并不好
    • 小图应用 PNG，其实对于大部分图标这类图片，齐全能够应用 SVG 代替
    • 照片应用 JPEG

代码输入后果

const promise1 = new Promise((resolve, reject) => {  setTimeout(() => {    resolve('success')  }, 1000)})const promise2 = promise1.then(() => {  throw new Error('error!!!')})console.log('promise1', promise1)console.log('promise2', promise2)setTimeout(() => {  console.log('promise1', promise1)  console.log('promise2', promise2)}, 2000)

输入后果如下：

promise1 Promise {<pending>}promise2 Promise {<pending>}Uncaught (in promise) Error: error!!!promise1 Promise {<fulfilled>: "success"}promise2 Promise {<rejected>: Error: error!!}

程度垂直居中的实现

  • 利用相对定位，先将元素的左上角通过top:50%和left:50%定位到页面的核心，而后再通过translate来调整元素的中心点到页面的核心。该办法须要思考浏览器兼容问题。
.parent {    position: relative;} .child {    position: absolute;    left: 50%;    top: 50%;    transform: translate(-50%,-50%);}
  • 利用相对定位，设置四个方向的值都为0，并将margin设置为auto，因为宽高固定，因而对应方向实现平分，能够实现程度和垂直方向上的居中。该办法实用于盒子有宽高的状况：
.parent {    position: relative;}.child {    position: absolute;    top: 0;    bottom: 0;    left: 0;    right: 0;    margin: auto;}
  • 利用相对定位，先将元素的左上角通过top:50%和left:50%定位到页面的核心，而后再通过margin负值来调整元素的中心点到页面的核心。该办法实用于盒子宽高已知的状况
.parent {    position: relative;}.child {    position: absolute;    top: 50%;    left: 50%;    margin-top: -50px;     /* 本身 height 的一半 */    margin-left: -50px;    /* 本身 width 的一半 */}
  • 应用flex布局，通过align-items:center和justify-content:center设置容器的垂直和程度方向上为居中对齐，而后它的子元素也能够实现垂直和程度的居中。该办法要思考兼容的问题，该办法在挪动端用的较多：
.parent {    display: flex;    justify-content:center;    align-items:center;}

实现一个扇形

用CSS实现扇形的思路和三角形基本一致，就是多了一个圆角的款式，实现一个90°的扇形：

div{    border: 100px solid transparent;    width: 0;    heigt: 0;    border-radius: 100px;    border-top-color: red;}

实现一个三角形

CSS绘制三角形次要用到的是border属性，也就是边框。

平时在给盒子设置边框时，往往都设置很窄，就可能误以为边框是由矩形组成的。实际上，border属性是右三角形组成的，上面看一个例子：

div {    width: 0;    height: 0;    border: 100px solid;    border-color: orange blue red green;}

将元素的长宽都设置为0

（1）三角1

div {    width: 0;    height: 0;    border-top: 50px solid red;    border-right: 50px solid transparent;    border-left: 50px solid transparent;}

（2）三角2

div {    width: 0;    height: 0;    border-bottom: 50px solid red;    border-right: 50px solid transparent;    border-left: 50px solid transparent;}

（3）三角3

div {    width: 0;    height: 0;    border-left: 50px solid red;    border-top: 50px solid transparent;    border-bottom: 50px solid transparent;}

（4）三角4

div {    width: 0;    height: 0;    border-right: 50px solid red;    border-top: 50px solid transparent;    border-bottom: 50px solid transparent;}

（5）三角5

div {    width: 0;    height: 0;    border-top: 100px solid red;    border-right: 100px solid transparent;}

还有很多，就不一一实现了，总体的准则就是通过上下左右边框来管制三角形的方向，用边框的宽度比来管制三角形的角度。

三栏布局的实现

三栏布局个别指的是页面中一共有三栏，左右两栏宽度固定，两头自适应的布局，三栏布局的具体实现：

  • 利用相对定位，左右两栏设置为相对定位，两头设置对应方向大小的margin的值。
.outer {  position: relative;  height: 100px;}.left {  position: absolute;  width: 100px;  height: 100px;  background: tomato;}.right {  position: absolute;  top: 0;  right: 0;  width: 200px;  height: 100px;  background: gold;}.center {  margin-left: 100px;  margin-right: 200px;  height: 100px;  background: lightgreen;}
  • 利用flex布局，左右两栏设置固定大小，两头一栏设置为flex:1。
.outer {  display: flex;  height: 100px;}.left {  width: 100px;  background: tomato;}.right {  width: 100px;  background: gold;}.center {  flex: 1;  background: lightgreen;}
  • 利用浮动，左右两栏设置固定大小，并设置对应方向的浮动。两头一栏设置左右两个方向的margin值，留神这种形式，两头一栏必须放到最初：
.outer {  height: 100px;}.left {  float: left;  width: 100px;  height: 100px;  background: tomato;}.right {  float: right;  width: 200px;  height: 100px;  background: gold;}.center {  height: 100px;  margin-left: 100px;  margin-right: 200px;  background: lightgreen;}
  • 圣杯布局，利用浮动和负边距来实现。父级元素设置左右的 padding，三列均设置向左浮动，两头一列放在最后面，宽度设置为父级元素的宽度，因而前面两列都被挤到了下一行，通过设置 margin 负值将其挪动到上一行，再利用绝对定位，定位到两边。
.outer {  height: 100px;  padding-left: 100px;  padding-right: 200px;}.left {  position: relative;  left: -100px;  float: left;  margin-left: -100%;  width: 100px;  height: 100px;  background: tomato;}.right {  position: relative;  left: 200px;  float: right;  margin-left: -200px;  width: 200px;  height: 100px;  background: gold;}.center {  float: left;  width: 100%;  height: 100px;  background: lightgreen;}
  • 双飞翼布局，双飞翼布局绝对于圣杯布局来说，左右地位的保留是通过两头列的 margin 值来实现的，而不是通过父元素的 padding 来实现的。实质上来说，也是通过浮动和外边距负值来实现的。
.outer {  height: 100px;}.left {  float: left;  margin-left: -100%;  width: 100px;  height: 100px;  background: tomato;}.right {  float: left;  margin-left: -200px;  width: 200px;  height: 100px;  background: gold;}.wrapper {  float: left;  width: 100%;  height: 100px;  background: lightgreen;}.center {  margin-left: 100px;  margin-right: 200px;  height: 100px;}

如何优化动画？

对于如何优化动画，咱们晓得，个别状况下，动画须要频繁的操作DOM，就就会导致页面的性能问题，咱们能够将动画的position属性设置为absolute或者fixed，将动画脱离文档流，这样他的回流就不会影响到页面了。

title与h1的区别、b与strong的区别、i与em的区别？

  • strong标签有语义，是起到减轻语气的成果，而b标签是没有的，b标签只是一个简略加粗标签。b标签之间的字符都设为粗体，strong标签增强字符的语气都是通过粗体来实现的，而搜索引擎更偏重strong标签。
  • title属性没有明确意义只示意是个题目，H1则示意档次明确的题目，对页面信息的抓取有很大的影响
  • i内容展现为斜体，em示意强调的文本

对浏览器内核的了解

浏览器内核次要分成两局部：

  • 渲染引擎的职责就是渲染，即在浏览器窗口中显示所申请的内容。默认状况下，渲染引擎能够显示 html、xml 文档及图片，它也能够借助插件显示其余类型数据，例如应用 PDF 阅读器插件，能够显示 PDF 格局。
  • JS 引擎：解析和执行 javascript 来实现网页的动态效果。

最开始渲染引擎和 JS 引擎并没有辨别的很明确，起初 JS 引擎越来越独立，内核就偏向于只指渲染引擎。

懒加载的特点

  • 缩小无用资源的加载：应用懒加载显著缩小了服务器的压力和流量，同时也减小了浏览器的累赘。
  • 晋升用户体验: 如果同时加载较多图片，可能须要期待的工夫较长，这样影响了用户体验，而应用懒加载就能大大的进步用户体验。
  • 避免加载过多图片而影响其余资源文件的加载 ：会影响网站利用的失常应用。

CDN的原理

CDN和DNS有着密不可分的分割，先来看一下DNS的解析域名过程，在浏览器输出的解析过程如下：
（1） 查看浏览器缓存
（2）查看操作系统缓存，常见的如hosts文件
（3）查看路由器缓存
（4）如果前几步都没没找到，会向ISP(网络服务提供商)的LDNS服务器查问
（5）如果LDNS服务器没找到，会向根域名服务器(Root Server)申请解析，分为以下几步：

  • 根服务器返回顶级域名(TLD)服务器如.com，.cn，.org等的地址，该例子中会返回.com的地址
  • 接着向顶级域名服务器发送申请，而后会返回次级域名(SLD)服务器的地址，本例子会返回.test的地址
  • 接着向次级域名服务器发送申请，而后会返回通过域名查问到的指标IP，本例子会返回www.test.com的地址
  • Local DNS Server会缓存后果，并返回给用户，缓存在零碎中

CDN的工作原理： （1）用户未应用CDN缓存资源的过程：

  1. 浏览器通过DNS对域名进行解析（就是下面的DNS解析过程），顺次失去此域名对应的IP地址
  2. 浏览器依据失去的IP地址，向域名的服务主机发送数据申请
  3. 服务器向浏览器返回响应数据

（2）用户应用CDN缓存资源的过程：

  1. 对于点击的数据的URL，通过本地DNS零碎的解析，发现该URL对应的是一个CDN专用的DNS服务器，DNS零碎就会将域名解析权交给CNAME指向的CDN专用的DNS服务器。
  2. CND专用DNS服务器将CND的全局负载平衡设施IP地址返回给用户
  3. 用户向CDN的全局负载平衡设施发动数据申请
  4. CDN的全局负载平衡设施依据用户的IP地址，以及用户申请的内容URL，抉择一台用户所属区域的区域负载平衡设施，通知用户向这台设施发动申请
  5. 区域负载平衡设施抉择一台适合的缓存服务器来提供服务，将该缓存服务器的IP地址返回给全局负载平衡设施
  6. 全局负载平衡设施把服务器的IP地址返回给用户
  7. 用户向该缓存服务器发动申请，缓存服务器响应用户的申请，将用户所需内容发送至用户终端。

如果缓存服务器没有用户想要的内容，那么缓存服务器就会向它的上一级缓存服务器申请内容，以此类推，直到获取到须要的资源。最初如果还是没有，就会回到本人的服务器去获取资源。

CNAME（意为：别名）：在域名解析中，实际上解析进去的指定域名对应的IP地址，或者该域名的一个CNAME，而后再依据这个CNAME来查找对应的IP地址。

DNS 记录和报文

DNS 服务器中以资源记录的模式存储信息，每一个 DNS 响应报文个别蕴含多条资源记录。一条资源记录的具体的格局为

（Name，Value，Type，TTL）

其中 TTL 是资源记录的生存工夫，它定义了资源记录可能被其余的 DNS 服务器缓存多长时间。

罕用的一共有四种 Type 的值，别离是 A、NS、CNAME 和 MX ，不同 Type 的值，对应资源记录代表的意义不同：

  • 如果 Type = A，则 Name 是主机名，Value 是主机名对应的 IP 地址。因而一条记录为 A 的资源记录，提供了标 准的主机名到 IP 地址的映射。
  • 如果 Type = NS，则 Name 是个域名，Value 是负责该域名的 DNS 服务器的主机名。这个记录次要用于 DNS 链式 查问时，返回下一级须要查问的 DNS 服务器的信息。
  • 如果 Type = CNAME，则 Name 为别名，Value 为该主机的标准主机名。该条记录用于向查问的主机返回一个主机名 对应的标准主机名，从而通知查问主机去查问这个主机名的 IP 地址。主机别名次要是为了通过给一些简单的主机名提供 一个便于记忆的简略的别名。
  • 如果 Type = MX，则 Name 为一个邮件服务器的别名，Value 为邮件服务器的标准主机名。它的作用和 CNAME 是一 样的，都是为了解决标准主机名不利于记忆的毛病。