前端语言学习综述
(本文精简课程挑选核心内容)
对课程重点总结如下:
a.前端语言介绍
b.前端语言的协作配合
c.HTML的新形式与应用
d.拓展(Web,UI与date等)
一,三剑客(HTML,JS,CSS)
区别:
首先可以用下面这张图总体描述三剑客的大致区别与功能偏向:
总结的核心观点就是:
HTML(hypertext Markup Language)---Create the structure 创建框架
CSS(Cascading Style Sheet)---Stylize the website 使网站风格化
Javascript---Increase interactivity 提高互动性
用人体结构类比:HTMI构建了骨骼,然后CSS基于骨骼构建了人的皮囊,而Javascript作为肌肉,让人具备健身的身体控制和运动能力。
接下来,对三剑客分别进行了描述:
HTML
HTML是一种标记语言,简单易学,用于描述网页的结构和内容。
CSS
CSS是一门语法非常简单的语言,CSS用于定义网页的样式和布局,使网页更具有吸引力和可读性,提供了丰富的样式选择和灵活的排版方式。
Javascript
JavaScript是一种脚本语言,用于实现网页上的交互和动态效果。它能够与用户进行交互、操作DOM和处理数据。有六个基本类型,分别是string number Boolean. Null undefined和symbol。
二,前端语言的协作配合
浏览器一般包含两种引擎,渲染引擎和javascript引擎。渲染引擎主要负责页面根据html代码来生成DOM数的结构--获取CSS资源,并构建CSS树。最后把页面绘制出来。
三剑客分别在另一语言中能产生不一样的应用(这里仅挑取一种应用):
CSS在HTML中应用
第一种是mysql,就直接在HTML标签中通过style或者class来添加样式的。第二种是内部的CSS。其实在HTM上头部通过style标签,第三种是引入外部的样式,这是常用的。
三,揭开HTML的面纱
在这个版块,主要学习了关于HTML的标签
下图总体上概括HTML所有标签分类
HTML5的介绍
从这部分开始,详细学习了HTML5的相关知识(语义化标签是重点核心):
对它的应用总结一个根本性原则就是:用对比不用好,不用比用错好
HTML5语义化标签
包含一些新的标签,canvas,视频,拖拽,坐标和浏览器页面的一个信息传输方式,多线程的web workers. 然后W3C在此基础上也扩展了一些新的规范。我认识到使用余额的标签可以帮助开发者更好的维护网站结构,也便于对网站进行一个进行整理。
关于HTML5存储,HTML5 indexedDB,PWA和AMP,Audio,Video,API等应用便不赘述
四,拓展交流
这部分主要是对Web和三类软件架构模式的学习
我结合老师讲解总结了一下web火热的原因
第一,是对用户友好,Web应用可以在各种设备和平台上运行,包括桌面电脑、移动设备和智能电视等。这种跨平台和跨设备的兼容性使得Web应用的覆盖范围更广,为用户提供了便利的访问方式。
第二,我觉得很重要,就是对开发者是比较友好的。Web是一个开放的平台,任何人都可以参与其中并共享自己的内容和创意。相比其他封闭平台,Web提供了更多的自由度和创造空间,这吸引了众多开发者、创作者和企业家的积极参与。
第三,Web技术的不断发展和进步,使得开发Web应用变得更加简洁和高效。HTML、CSS和JavaScript等技术的不断演进,为开发者提供了丰富的工具和框架,使其能够创建出更好的用户体验和功能丰富的Web应用。
第四,随着互联网在全球范围内的普及,愈来愈多的人都能够访问和使用Web。这导致了Web上用户数量的巨大增长,从而使得Web成为商业、社交和娱乐等方面的重要平台。
课程总结
第一部分学习前端语言的一个基础,特别是一些代码CSS、javascript一些基本概念。然后也学习了在浏览器上是如何运行的。
第二部分学习这些云之间的协作。比如说在excel表中如何来应用CS和javascript, 以及通过javascript如何让HIML具备可动态性。
第三部分重点学习HTML,首先介绍它基本的一个标签体系。其次我们重点讲一下HTML5的一些特性。比如说一句话存储音视频,浏览器、API以及一些可视化相关的一些能力。
第四部分回顾了为什么Web火爆,MVC,MVVM,MVP的区分以及UI和data之间他们是如何做交互的。
就学习前端语言而言,选择器、伪元素选择器、ID选择器等,JS中修改动物元素的属性、批量操作、修改class属性和引入外部样式的方法这类应用类内容的学习比较困难,而定义概念类相对简单。总体上,前端语言的学习需要一定的时间和实践,但相对来说还是比较容易入门的。通过不断的练习和项目实践,可以逐渐掌握并提升你的前端开发技能。同时,也可以参考在线教程、文档和社区资源来帮助你更好地学习和理解前端语言的细节和最佳实践。