关于HTML页面加载理解【更容易去理解HTML+CSS+script】---转自https://blog.csdn.net/m0_37550086/article/details/77513676

1.首先要了解页面的结构(包含哪些元素?哪些计算机语言能够在页面中运行 )
(1)html
不仅可以包含文字,还可以包含图片、链接,甚至音乐、程序等非文字元素的标记语言
(展示给用户,不能太单调,css)
(2)css
是一种用来表现HTML的计算机语言,能使HTML页面变得更加美观
(要展示给用户光漂亮是不够的,用户还要能够动态的操作HTML页面,也就是让浏览器和用户之间的交互不仅仅是用户能浏览html中的内容,还要能对html页面操作,JavaScript)
(3)JavaScript
用来给HTML网页增加动态功能、交互行为
是一种解释性脚本语言(不进行预编译)
目前我们熟悉的语言Java、JavaScript、C、C++,都属于高级编程语言
①计算机不能理解高级语言,也就不能直接执行高级语言了
②计算机只能直接理解机器语言,所以任何语言,都必须将其翻译成机器语言,计算机才能运行高级语言编写的程序
③翻译的方式有两种,一个是编译,一个是解释。
1)编译:Java语言的运行先经过编译,但是JAVA语言的编译不是直接编译成计算机能识别的语言,而是编译成JAVA虚拟机能识别的class文件
JAVA语言就是典型的翻译方式为编译的编程语言,
虽然不是编译成计算机能直接识别的语言,但是同其他以编译为翻译方式的高级编程语言的原理大体上是相同的。
最明显:C/C++,可以编译成二进制代码,以可执行文件的形式存在(exe文件)
都是先编译再运行,而且是一次编译到处运行,效率非常高。(只需要在第一次运行的时候编译一次)
2)解释:解释性脚本语言的程序不需要编译,解释性脚本语言在运行程序的时候才翻译
解释性脚本语言有专门的解释器来负责解释,不过每次都需要翻译,效率比较低。
JavaScript 就是一种解释性脚本语言
④JavaScript也有自己专门的解释器——JavaScript引擎,它存在于浏览器端,作为浏览器的一部分
一句话:html(超文本标记语言)、css(层叠 样式表)、JavaScript脚本语言这三样东西在浏览器端相互配合、相辅相成形成了比较成熟的前端界面
(4)这三样东西在HTML页面中的位置
[html] view plain copy

html的基本结构








①html:贯穿整个页面
②css:三种声明方式
外联样式表:在head便签中 用link标签的href属性来引用后缀名为.css的css样式文件
内联样式表:在head标签下的style标签中,选择器 + 样式声明
内部样式表:在标签的style属性中添加css样式声明
③JavaScript:在标签中,可以在head标签中,也可以在body标签中(区别一会再说)

小总结:
以上内容总结出一句话:目前为止,在整个html页面中,可以写html代码、css样式、JS脚本语言
位置:html贯穿整个页面,
css可以定义在head头标签中,也可以在定义在html标签的属性中
JavaScript定义在标签中,标签既能在head标签中定义也能在body标签中定义
问题1:JQuery、EasyUI也可以写在html页面中
jQuery是一个快速、简洁的JavaScript框架(本质上也是JavaScript)
EasyUI:类库中都是以 .css和.js结尾的文件。别人写好的css样式和JavaScript(本质上也是css和JavaScript)
所以追其根源,html页面中就是 html、css、JavaScript
问题2:jsp中能编写Java代码
jsp是特殊的Servlet,本质是Java,是Java就要运行在服务器端,浏览器是不能解析Java代码的
为什么用浏览器访问jsp时能在浏览器端显示呢?
分两种情况:
①对于html文件,当我们用浏览器访问时能自动解析,解析完毕就会将内容展示在浏览器上
②对于jsp,当我们用浏览器访问时,我们写好的jsp文件会生成.java文件,服务器运行JAVA文件,会把jsp中编写的html代码,发送给浏览器
可以这样理解,我们编写的HTML文件被浏览器直接解析
而我们编写的jsp,是借助JAVA代码将html代码发给浏览器,浏览器再解析
本质上都是浏览器解析html代码(这里的html代码,包括刚才说的html、css、JavaScript)
2.加载顺序







…………..

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值