前端语言串讲
前端语言的基本能力
前端语言:
HTML、CSS、Javascript
HTML:超文本标记语言,是用于创建网页的标准标记语言。HTML不是一种编程语言,而是一种用于定义内容结构的标记语言
CSS:用于解决内容与表现分离的问题,它可以控制网页中元素的布局、颜色、字体和动画等各种样式,语法简单(各种选择器、伪元素、伪类)
Javascript:借鉴了C语言的基本语法,借鉴了Java语言的数据类型和内存管理。
Browser允许用户在计算机、智能手机、平板电脑等设备上浏览和呈现网页内容
解释器:
1. CSS in HTML\
- 内联样式:直接在HTML元素内使用style属性定义CSS规则。
- 内部样式表:在HTML 部分使用标签定义CSS规则。
- 外部样式表:使用link标签在HTML头部引用外部.css文件。
2.javascript in HTML
在HTML中使用JavaScript的主要方法有:
- 内联JavaScript
使用HTML的
- 外部JavaScript文件
使用
- DOM操作
JavaScript可以操作HTML文档对象模型(DOM),动态修改HTML元素和属性,实现动态效果。
例如:
- 获取元素:document.getElementById()
- 添加/删除元素:appendChild()/removeChild()
- 修改属性:element.innerHTML
- 事件处理:element.onclick=function(){}
- BOM操作
浏览器对象模型(BOM)提供了控制浏览器窗口的方法,如:
- 弹出框:alert()
- 定时器:setTimeout()/setInterval()
- 位置对象:window.location
- 历史对象:history
- 表单验证
使用JavaScript可以实时验证表单输入内容,如required属性、正则表达式等。
- Ajax技术
通过XMLHttpRequest对象可以实现异步加载数据,比如加载更多内容。
- 特效处理
利用CSS和动画效果实现滚动条、轮播图、弹出层等交互效果。
HTML
HTML标签分类:
HTML head标签
2. HTML ARIA
HTML 5(变成一门图灵完备的语言)
HTML 5 语义化标签
HTML 5 表单增强
HTML5 存储
HTML 5 IndexedDB、PWA&
HTML5 Audio、Video、API
HTML 5 Web Worker、Shadow DOM(防止被访问)、
Web component、SVG&Canvas
WebGL&WebGPU Webassembly
Web的风靡原因:\
- 可访问性强。Web采用了开放的网络传输协议HTTP,任何设备只要连接互联网就可以访问Web内容,极大降低了使用门槛。
- 交互性强。Web页面通过网页本身的交互设计,以及后端技术支持,提供了丰富的用户体验,用户可以主动参与和操作。
- 信息传播快。Web使得信息的传播不再受限于物理距离,任何人只要一点击链接就可以获取全球各地的信息,极大推动了信息的传播速度。
- 内容丰富。Web上的内容类型包罗万象,从简单的文本、图片到视频、游戏等丰富多彩的互联网应用,吸引了各行各业和各年龄段的用户。
- 开放性强。Web标准如HTML、HTTP等都是开放的,任何人和组织都可以基于这些标准进行开发,极大促进了Web生态系统的兴起。
- 社交性强。Web上的社交网络服务如Facebook、微博等极大激发了人们的社交需求,改变了人与人之间的互动模式。
- 商业模式成熟。电子商务的兴起使Web真正实现了商业价值,成为企业营销和运营的重要渠道,从而吸引了大量资本和人才的参与。
所以,Web之所以能够风靡全球,离不开其开放、便捷、互动和商业化的特点,这也是它在信息社会中占据主导地位的重要原因
大前端
MVC&MVVM&MVP