前端开发者应知必会:浏览器是如何渲染网页的

html-css022

前端开发者应知必会:浏览器是如何渲染网页的,第1张

主要由渲染引擎完成,渲染引擎主要包括:HTML解释器 CSS解释器 布局(layout) JavaScript引擎

HTML解释器:解释HTML文本的解释器,主要作用是将HTML文本解释成DOM(文档对象模型)树,DOM是一种文档的表示方法;

CSS解释器:级联样式表的解释器,它的作用是为DOM中的各个元素对象计算出样式信息,从而为计算机最后网页的布局提供基础设施;

布局:在DOM创建之后,Webkit需要将其中的元素对象跟样式信息结合起来,计算它们的大小位置等布局信息,形成一个能够表示这所有信息的内部表示模型;

JacaScript引擎:使用JavaScript代码可以修改网页的内容,也能修改CSS的信息,JavaScript引擎能够解释JavaScript代码并通过DOM接口和CSSOM接口来修改网页内容和样式信息,从而改变渲染的结果;

绘图:使用图形库将布局计算后的各个网页的节点绘制成图形结果(例如:需要依赖2D/3D图形库,音频视频和图片解码器等来实现高性能的网页绘制和网页的3D渲染);

此内容摘自webkit内核书上复制下来的

(1)在html文件的head中添加代码,例如:

<script src="../js/jquery-1.7.1min.js"></script>(src是js文件的路径)

(2)也可以把js文件直接拖进html页面

科普:JS一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。