从零开始学前端

2020-06-22

Ann Ann

什么是前端?

这个课程是前端开发培训,首先要知道,什么是前端?

网页是服务器发送的,但用户在浏览器里打开。因此,网站开发可以分成两部分:服务器端编程和浏览器端编程。

传统上,针对浏览器的编程,称为前端开发。

当然,前端的含义现在大大扩展,移动端编程和Node.js的编程,往往也算入前端,但我们这个课程只教浏览器编程。

前端的组成

用户在浏览器里看到的,只是一张网页。但是实际上,他同时消费了三样东西。

  • 内容:文字、图片、视频等等
  • 排版:网页的外观样式
  • 互动:对网页的操控,比如检查表单

前端开发就是由这三个部分组成,每个部分都对应一项专门的技术。

  • HTML:结构化文档,提供网页内容
  • CSS:样式表,负责网页外观
  • JavaScript:浏览器脚本,负责控制浏览器的行为

浏览器将这三样东西合在一起,就构成了用户看到的网页。

我们这个课程就是要教会大家这三项技术。

浏览器的工作原理

虽然浏览器是非常复杂的软件,但是用起来很简单。

  1. 用户在地址栏键入网址,或者点击网页上的链接
  2. 浏览器向服务器发出请求
  3. 服务器向浏览器发送回应
  4. 浏览器将服务器送来的HTML文档、CSS样式表、JavaScript脚本,合并成一张网页,显示给用户

看明白了吗?前端开发只要准备好HTML文档、CSS样式表、JavaScript脚本这三样东西,将它们放在服务器上,浏览器能够取得,就可以了。

浏览器的工作过程

虽然HTML文档、CSS样式表、JavaScript脚本这些名字听上去很专业,实际上它们都是最普通的文本文件。任何一种文字编辑器,都可以编写。

那么,文本文件怎么就变成了网页呢?这个可就复杂了。

(1)第一阶段:HTML文档解析

收到服务器发送的HTML文档后,浏览器在内存中,将HTML文档拆分成一个树状结构,称为DOM树。

(2)第二阶段:CSS渲染

浏览器发现,DOM树的某些节点是CSS样式表或JavaScript脚本,于是向服务器请求这两样东西。

收到CSS样式表之后,浏览器将其解析成各种样式规则,套用到指定的DOM节点上,让它们具有视觉外观。这个过程称为”渲染“(rendering)。

(3)第三阶段:脚本执行

收到JavaScript脚本之后,浏览器会立刻运行这个脚本,对网页进行各种处理。

经过这三个阶段,浏览器将最终生成的网页,显示给用户,用户开始浏览。

没看懂这个过程?没关系,后面的课程,这些东西都会详细讲解的。

近期开课hot
logo

Follow Us

linkedinfacebooktwitterinstagramweiboyoutubebilibilitiktokxigua

We Accept

/image/layout/pay-paypal.png/image/layout/pay-visa.png/image/layout/pay-master-card.png/image/layout/pay-stripe.png/image/layout/pay-alipay.png

地址

Level 10b, 144 Edward Street, Brisbane CBD(Headquarter)
Level 8, 11 York st, Wynyard, Sydney CBD
Business Hub, 155 Waymouth St, Adelaide SA 5000

Disclaimer

footer-disclaimerfooter-disclaimer

JR Academy acknowledges Traditional Owners of Country throughout Australia and recognises the continuing connection to lands, waters and communities. We pay our respect to Aboriginal and Torres Strait Islander cultures; and to Elders past and present. Aboriginal and Torres Strait Islander peoples should be aware that this website may contain images or names of people who have since passed away.

匠人学院网站上的所有内容,包括课程材料、徽标和匠人学院网站上提供的信息,均受澳大利亚政府知识产权法的保护。严禁未经授权使用、销售、分发、复制或修改。违规行为可能会导致法律诉讼。通过访问我们的网站,您同意尊重我们的知识产权。 JR Academy Pty Ltd 保留所有权利,包括专利、商标和版权。任何侵权行为都将受到法律追究。查看用户协议

© 2017-2024 JR Academy Pty Ltd. All rights reserved.

ABN 26621887572