1.简述<!DOCTYPE> 的作用,标准模式和兼容模式各有什么区别?
<!DOCTYPE> 位于文档的第一行,告知浏览器使用哪种规范。
如果不写DOCTYPE,浏览器会进入混杂模式。
标准模式和兼容模式的区别:
标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防站点无法工作。
2.HTML5 为什么只需要写< !DOCTYPE HTML>?
html5不急于SMGL,因此不需要对DTD进行引用,但是需要doctype来规范浏览器的行为。
3.从seo角度,给出至少2条html书写注意要点
a标签一定要有title属性;
img标签一定要有title属性和alt属性;
页面上有且只能有一个h1;
stong标签内定义重要的文本;
选用语义化的html标签
4.列出html5中新增的表单控件
输入类型:email、url、number、range、Date pickers(date/month/time/datetime/datetime-local)、search、color
表单元素:datalist、keygen、output
5.盒模型
标准盒模型:content(内容)、padding(内边距)、border(边框)、margin(外边距)
IE盒模型的content包含border和padding
6.data-*属性的作用
html5规范里新增了一个自定义data属性。
为前端开发者提供自定义属性,这些属性可以通过对象的dataset属性获取,不支持该属性的浏览器可以通过getAttribute方法获取。
7.如果把html5看作一个开放平台,那它的构建模块有哪些?
Web Storage API
基于位置服务的LBS
无插件播放音频、视频
调用相机和GPU图像树立单元等硬件设备
拖拽和Form API
8.请描述cookies、sessionStorage、localStorage的区别
描述:
cookies数据始终在同源的http请求中携带,在浏览器和服务器间来回传递。多用于网站标示用户是否登录等。
sessionStorage和localStorage不会把缓存的数据自动发给服务器,仅在本地保存。
存储大小:
cookies数据大小不能超过4k。
sessionStorage和localStorage缓存也有存储大小限制,但比cookies大得多,可以达到5M或更大。
缓存有效时间:
cookies在设置cookie过期时间之前一直有效,即使窗口关闭或浏览器关闭。
sessionStorage缓存的数据在窗口关闭或浏览器关闭时自动清除。
localStorage永久存储数据,除非主动删除。
作用域:
cookies在所有同源窗口内都是共享的。
sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面。
localStorage在所有同源窗口内共享。
9.src和href的区别
src指向外部资源的位置,用户替换当前元素,比如js脚本,图片等元素
href指向网络资源所在位置,用户当前薇恩当和引用资源间确定关系,加载css
10.HTML和XHTML的区别?
XHTML元素必须被正确的关闭
XHTML元素必须被关闭
标签名必须用小写字母(XHTML规范定义:标签名和属性对大小写敏感)
XHTML文档必须拥有根元素(所有的 XHTML 元素必须被嵌套于 <html> 根元素中)
11.页面导入样式时,使用link和@import有什么区别?
link:属于html标签,除了加载css外,还能用于定义RSS,定义rel连接属性等作用。无兼容性问题。在页面被加载时,link会同时被加载。
@import:css提供的,只能用于加载css样式。兼容IE5以上。@import引用的css样式会等到页面被加载完再加载。
12.介绍一下对浏览器内核的理解
主要分成两部分:渲染引擎和JS引擎。
渲染引擎:负责取得网页的内容(HTML、XML、图像等等)、整理讯息(例如加入CSS等),以及计算网页的显示方式,然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同,所以渲染的效果也不相同。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要内核。
JS引擎则:解析和执行javascript来实现网页的动态效果。