对于HTML页面中CSS, JS, HTML的加载与执行过程的简单分析

最近在研究HTML页面中JavaScript的执行顺序问题。在JavaScript中,定义一个方法或者函数有很多方式,最常见的有2中,function语句式与函数直接量方式。

 

对于function语句式,解释器会优先解释。即加载了这个js文件后,会扫描一下所有的js代码,然后把该优先执行的东西先执行了,然后再从上到下按顺序执行。所以,定义的代码可以在执行的代码后边。就跟C#中的方法定义一样。解释器已经记住了这个方法,知道在内存中的哪里,用的时候直接去取就行了。

 

C#语言是,对象中的属性与方法具有优先的解释权,先放到内存中,之后哪里都可以用,所以没有先后顺序。这也是对象定义的时候,字段中不能有任何计算的原因。因为字段在优先解释的时候,只是为这个对象开辟内存空间,然后把值放入到内存空间。一个字段肯定不会用到另外的一个字段,因为字段定义的时候,是没有计算的。如果用到了另外一个字段,那肯定是有计算了,就报错了。

对于HTML页面中CSS, JS, HTML的加载与执行过程的简单分析_第1张图片


但是函数直接量方式,地位跟一般的普通变量一样,没有优先解释权。是在正常的从上到下运行过程中,遇到了才在内存中分配地址。遇到之前,解释器里根本没这个东西,不知道是什么。所以下边的这个代码就会出错。



接下来我们来看一个例子,一段代码。







 
HelloWorld
//HHHHHHHHHHHHHHHH


 

这段代码在页面中运行的时候是报错的。不是说function语句式定义的函数,在前边调用也可以吗?但是注意,调用与定义要在同一个script代码块中。在这个例子中,在不同的script语句块中,所有报错了。但是如果前边定义,后边调用,就可以。

 

现在来分析一下所有的这些CSS,HTML,JS文件的执行顺序。接下来仅仅是我自己的一些观点。

 

当浏览器向服务器发起一次请求之后,xxx.com,服务器会向浏览器返回字符串,即HTML代码。接下来的执行情况是这样的。浏览器会一点点的从头接收这些字符串,然后从节点开始分析,从上到下,遇到

你可能感兴趣的:(技术积累)