关于审查元素与查看网页源码的区别

不知道大家发现没有，当我们用chrome浏览器打开任意一个网页，右键单击页面有两个很相似的选项

就是查看网页源代码以及检查（审查元素）。

之前我一直认为这两个选项是没有什么区别的，但chrome既然列出来这两项自然有它的道理。

来看一个简单的页面：

在网页中的显示效果为（为压缩图片大小删掉了大部分空白）：

我们审查元素

会发现标签中已经多出来了一句话。

而网页源代码中，标签中是没有这一句话的：

这一句话是通过JS动态生成的。

所以，审查元素和查看网页源码还是有一点区别的，这个区别可以说是源代码和DOM的区别，我们审查元素，实际上是查看DOM，DOM渲染过了，查看网页源码看到的才是未解析的源代码。以上就是这篇文章的全部内容了，希望对大家的学习和工作能有一定的帮助。

Web前端开发所涉及的内容主要包括W3C标准中的结构、行为和表现，那么这三项中我们需要掌握的核心技能是什么呢？

1.开发语言

HTML发展历史有二十多年，历经多次版本更新，HTML5和CSS3的出现又是一次革新。有些人认为前端开发要掌握的技能简单，不就是制作网页 嘛，其实不然，web前端需要掌握的核心语言xHTML+CSS+JavaScript，JavaScript作为最难的语言之一，许多编程高手也不敢妄 自菲薄自封精通。由于JavaScript与html的差异性，以及静动态分开处理的一些好处。在大公司编写静态效果和动态效果往往是分开由不同的人完成 的。小公司因为需要压缩成本，就要求每个人会的越多越好，如果您想往项目经理发展，能懂一两门后台语言，绝对是锦上添花！

2.浏览器兼容性

互联网目前主流浏览器有IE6789，Firefox，Chrome，Opera，Safari，遨游，包括国内主流的搜狗，腾讯 TT，360，the World等等；从内核上讲主要有IE的，遨游版IE，safari，firefox以及opera的，这些都是大家常见的，如果你身边有老网虫喜欢收藏 浏览器，你翻翻他的硬盘网页源代码可以看到什么，相信几十款肯定是有的（或查看前端社区中的浏览器大全）。每种内核对代码的解析是不完全一样的，即使同样内核也可能存在很大差异，如IE和遨游版的IE。不说非主流的浏览器，就主流的浏览器要做到完全兼容，也并非易事，需要长时间的积累和测试，需要前端开发工程师对前端开发的热爱和激情。

目前移动互联网的发展趋势也不容小觑，将慢慢占据互联网的主要份额。移动互联网最突出的好处是方便和及时，试想一下，走在某地风景很好，拍下来后自 动分享给各路好友，因此手机上的浏览器兼容也看刻不容缓，现在手机上的浏览器也是纷繁复杂，主流的UCWEB，safari，IE，3G门户的，以及 symbian低端机的“残缺儿童”，包括国外流行手机我们不知道的一些浏览器，更糟糕的是这些浏览器解析因为手机硬件的不同，每个浏览器得到的结果都是完全不同的。

3.hack技术

由于不同的浏览器对CSS的解析认识不一样，因此会导致生成的页面效果不一样，这个时候就需要针对不同的浏览器写不同的CSS，这个过程叫CSS hack。虽然我们写代码都要求按照标准，不写hack代码，但实际工作中为了兼容主流浏览器，hack代码是免不了的，所以这也应该是每个前端开发人员 必备的技能。

4.业内标准

目前Web前端开发中提到最多的就是W3C标准，这是一系列标准的集合，代表了互联网发展的方向，也代表了前端开发的一种信仰。写的代码都要100%通过标准验证，为通过标准验证而感到自豪，会有效推动互联网的快速发展。

5.开发工具

目前比较流行的是Dreamweaver， 其曾经风靡一时，到现在也没有退出历史舞台，证明DW还是有很大优势的，尤其是针对初学者，其强大的提示功能可以帮助我们很快的熟悉并掌握网页布局，但现 在更提倡的是纯手写代码，既体现技能方面的卓越，也可有效避免使用DW等工具产生的冗余代码。此外再掌握一些photoshop技能，即使没有美工，也能 简单处理一些图像。

小结，掌握以上技能，可以说你是一个合格的前端开发人员，能够参与到一个大的项目中，或者自己独立写出一个网页。虽然这看起来和网页制作设计差不多，从效果上来看，都是制作网页的，但实际上，技术上所超出的已经是好几个档次的东西了。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持查字典教程网。

状态码是由3位数字和原因短语组成的（比如最常见的：200 OK），其中第一位数字表示响应类别，响应类别从1到5分为五种

add：其实我查阅资料发现还有一个6打头的一个 600 Unparseable Response Headers

表示服务器没有返回响应头部，只返回实体内容，也算做服务器错误状态码吧，不过绝对不常见

状态码

响应类别

原因短语

1XX

信息性状态码（Informational）

服务器正在处理请求

2XX

成功状态码（Success）

请求已正常处理完毕

3XX

重定向状态码（Redirection）

需要进行额外操作以完成请求

4XX

客户端错误状态码（Client Error）

客户端原因导致服务器无法处理请求

5XX

服务器错误状态码（Server Error）

服务器原因导致处理请求出错

状态码响应类别的的定义是必须遵守的，后面的两个数字服务器自己DIY也没什么问题

RFC2616（用来指定HTTP协议标准的文档）标准定义的就有四十多种，加上扩展能达到六十种

不过常见的大概只有十四种，下面我来谈谈这些有代表性的14种HTTP状态码

2XX 成功

200 OK

表示请求被服务器正常处理

最常见的就是这个了，随着这个状态码返回的信息跟你的请求方法有关，比如GET请求，请求的资源会作为响应实体返回，而HEAD请求，信息只存在于响应报文首部，因为它不会返回报文实体，只返回报文首部

204 No Content

表示请求已成功处理，但是没有内容返回（就应该没有内容返回的状况），也就是返回的响应报文中没有报文实体（其实是没有报文实体的主体部分），浏览器向服务器发送请求后收到了204网页源代码可以看到什么，那么浏览器页面不会发生更新，一般用在只是客户端向服务器发送信息，而服务器不用向客户端返回什么信息的情况

206 Partial Content

表示服务器已经完成了部分GET请求（客户端进行了范围请求），响应报文中包含Content-Range指定范围的实体内容

3XX 重定向

301 Moved Permanently

永久重定向，表示请求的资源已经永久的搬到了其他位置，就是说资源已经被分配了新的URI ，新的URI应该提示在响应报文的Location首部字段，只要不是HEAD请求，响应实体应该包含新URI的超链接和简短的说明

302 Found

临时重定向，表示请求的资源临时搬到了其他位置，请求的资源暂时被配到到了新的URI，和301很像，只不过资源是临时移动，资源在将来可能还会改变，同样地，新的临时URI应该提示在响应报文的Location首部字段，只要不是HEAD请求，响应实体应该包含新URI的超链接和简短的说明

303 See Other

表示请求资源存在另一个URI，应使用GET定向获取请求资源，303功能与302一样，区别只是303明确客户端应该使用GET访问，（很多HTTP/1.1之前的浏览器不能理解303，但是大家都把302当303对待，使用GET请求新URI）

304 Not Modified

表示客户端发送附带条件的请求（GET方法请求报文中的IF…）时，条件不满足，返回304时，不包含任何响应主体，虽然304被划分在3XX，但和重定向一毛钱关系都没有

307 Temporary Redirect

临时重定向，和302有着相同含义，尽管302标准禁止POST变为GET，但没人听他的，而307就会遵照标准，不会从POST变为GET，但处理响应行为，各个浏览器可能不同

4XX 客户端错误

400 Bad Request

表示请求报文存在语法错误或参数错误，服务器不理解，服务器不应该重复提交这个请求，需要修改请求内容后再次发送

401 Unauthorized