一、浏览器
1.浏览器页面有哪三层构成,分别是什么,作用是什么?
- 结构层:HTML
- 表示层:CSS,页面的表现风格
- 行为层:JS,客户端功能、业务
2.内核&主流浏览器内核?
内核 Rendering engine:解析DOM文档和CSS规则并将内容排版到浏览器中显示有样式的界面
a、 IE: trident 内核
b、 Firefox : gecko 内核
c、 Safari: webkit 内核
d、 Opera: 以前是 presto 内核, Opera 现已改用 Google Chrome 的 Blink 内核
e、 Chrome:Blink( 基于 webkit , Google 与 Opera Software 共同开发 )
二、web
1.web标准&w3c
本质就是一些语法规范
关注web和用户交互的的接口、技术标准。集成到客户端环境中。
三、HTML5
1.HTML5是什么
是HTML的新一代标准。
HTML4太依赖插件=>为了减少依赖,用户体验更好,开发方便
然后可以讲一下优缺点
2.HTML5的优缺点
3.HTML5增加的元素
简记:结构:头部 导航;级块:code;行内语义:音频;交互:菜单
4.HTML5元素
5.cookie & Storage
都是在浏览器端存储的数据。
- cookie:随时发请求到服务器。小&开销&各数限制
- localStorage SessionStorage是HTML5提供的API,不用在C & S之间来回穿数据
(1)localStorage 永久存储。存储量5MB。
(2)SessionStorage 浏览器窗口的概念。⚠️窗口!!
四、HTML文件&标签用法等
1.Doctype作用;严格模式与混杂模式怎么区分&意义
(1)声明位于文档中的最前面的位置,处于标签之前。此标签告诉浏览器按照何种规范解析页面。<!doctype html>
(2)严格模式:排版、JS以浏览器支持的最高标准允许;混杂模式:模拟老式浏览器行为=>doctype不存在/格式不正确
即:有就用最高标准/ w3c标准解析;没有就以浏览器各自不同的模式解析
2.语义化的理解
根据内容的意思,选择合适的标签
- 对开发者:直接看的时候很方便。
- 对于爬虫:依赖标签确定信息
- 对于其他设备解析:(盲人阅读器等)用意义对方式渲染
- link @import区别
都是外部引用css文件。
- 本质:link是个标签(其他属性 rel等);@import只是一种方式
- 加载顺序:link和网页同时;@等到页面全部下载才加载(一开始可能没样式)
- 兼容性:@在很老的浏览器不兼容
- dom:link的样式:可以用js改变(element.style等),@🙅
4.HTML 全局属性
16个全局属性
class、id、style、title、lang
5.<a target="value"> 其中value取值
a、 _blank :在【新窗口】中打开链接文件
b、 _parent :将链接的文件载入含有该链接【框架】的父框架集或父窗口中。如果含有该链接的框架不是嵌套的,则在浏览器全屏窗口中载入链接的文件,就象 _self 参数一。
c、 _self :在【同一框架或窗口】中打开所链接的文档。此参数为默认值,通常不用指定。但是我不太理解。
d、 _top :在【当前整个窗口】中打开所链接的文档,因而会删除所有框架。
6.data-属性
data-
为H5新增的为前端开发者提供自定义的属性,这些属性集可以通过对象的 dataset
属性获取,不支持该属性的浏览器可以通过 getAttribute
方法获取 :
data-实例
五、WEBGL
1.什么是WEBGL&优点
3D绘图标准:OPENGL(提供接口、使用底层图形硬件渲染)+JS(脚本实现)
为canvas提供3D加速渲染。=>可以在浏览器里展示3D场景
提供一些开源库,比如three.js
六、SVG
1.SVG的理解