问题:什么是【伪类】和【伪元素】
参考答案:
伪类:用于已有元素处于某种状态时为其添加对应的样式,这个状态是根据用户行为而动态变化的。
举例:当用户悬停在指定元素时,可以通过:hover来描述这个元素的状态,虽然它和一般css相似,可以为 已有元素添加样式,但是它只有处于DOM树无法描述的状态下才能为元素添加样式,所以称为伪类。
伪元素:用于创建一些不在DOM树中的元素,并为其添加样式。
举例:我们可以通过:before来在一个元素之前添加一些文本,并为这些文本添加样式,虽然用户可以看见 这些文本,但是它实际上并不在DOM文档中。
问题:什么是【浏览器内核】?常用的浏览器内核有哪些?
参考答案:
浏览器内核主要分成两部分:渲染引擎(Layout Engine或Rendering Engine)和JS引擎。
渲染引擎:负责取得网页的内容(HTML、XML、图像等等)、整理讯息(例如加入CSS等),以及计算网页的显示方式,然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同,所以渲染的效果也不相同。
JS引擎:解析和执行javascript来实现网页的动态效果。
常见的浏览器内核:
内核 | 代表浏览器 |
Trident | IE |
Gecko | Mozilla Firefox |
Webkit | Safari |
Blink | chrome、Opera |
问题:HTML5新增了哪些特性?移除了哪些元素?如果区分HTML和HTML5
参考答案:
新增特性(挑几个重要的):
- 新增选择器 document.querySelector、document.querySelectorAll
- 媒体播放 video、 audio
- 本地存储 localStorage 和 sessionStorage
- 语意化标签 article、footer、header、nav、section
- 增强表单控件 calendar、date、time、email、url、search
- 地理位置 Geolocation
- 新技术 webworker、 websocket
- 绘画 canvas
移除特性:
- 纯表现的元素:basefont big center font s strike tt u
- 性能较差元素:frame frameset noframes
如何区分:DOCTYPE声明的方式
问题:什么是HTML语义化?语义化的好处是什么?
参考答案:
在HTML5出来之前,我们习惯于用div来表示页面的章节或者不同模块,但是div本身是没有语义的。HTML5中加入了一些语义化标签,来更清晰的表达文档结构。
语义化的目的:更清晰地表达文档结构。
语义化的优点:
- 易于用户阅读,样式丢失的时候能让页面呈现清晰的结构。
- 有利于SEO,搜索引擎根据标签来确定上下文和各个关键字的权重。
- 方便屏幕阅读器解析,如盲人阅读器根据语义渲染网页
- 有利于开发和维护,语义化更具可读性,代码更好维护,与CSS3关系更和谐。
问题:cookies,sessionStorage和localStorage的共同点和不同点
参考答案:
共同点:三者都是保存在浏览器端,且是同源的。
区别:
①保存方式不同
cookies始终在同源http请求中携带,即在浏览器和服务器间来回传递,而sessionstorage和localstorage不会自动把数据发给服务器,仅在本地保存
②存储大小的限制不同
cookie保存的数据很小,不能超过4k,而sessionstorage和localstorage保存的数据大,可达到5M
③数据的有效期不同
cookie在设置的cookie过期时间之前一直有效,即使窗口或者浏览器关闭。sessionstorage仅在浏览器窗口关闭之前有效。localstorage始终有效,窗口和浏览器关闭也一直保存,用作长久数据保存
④作用域不同
cookie在所有的同源窗口都是共享;sessionstorage不在不同的浏览器共享,即使同一页面;localstorage在所有同源窗口都是共享
资料来源于网络,持续更新中......