HTML5面试题汇总

1、html5有哪些新特性?移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?

答:新特性:

(1)拖拽释放(Drag and drop) API

(2)语义化更好的内容标签(header,nav,footer,aside,article,section)

(3)音频、视频API(audio,video)

(4) 画布(Canvas) API

(5)地理(Geolocation) API

(6)本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢失;

(7)sessionStorage 的数据在浏览器关闭后自动删除

(8)表单控件,calendar、date、time、email、url、search 

(9)新的技术webworker, websocket, Geolocation

移除的元素:

(1)纯表现的元素:basefont,big,center,font, s,strike,tt,u;

(2)对可用性产生负面影响的元素:frame,frameset,noframes;

支持HTML5新标签:

(1)IE8/IE7/IE6支持通过 document.createElement 方法产生的标签,可以利用这一特性让这些浏览器支持 HTML5 新标签,浏览器支持新标签后,还需要添加标签默认的样式(当然最好的方式是直接使用成熟的框架、使用最多的是html5shim框架):

<!--[if lt IE 9]>

<script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>

<![endif]-->

如何区分:

DOCTYPE声明新增的结构元素、功能元素

2、本地存储(Local Storage )和cookies(储存在用户本地终端上的数据)之间的区别是什么?

答:Cookies:服务器和客户端都可以访问;大小只有4KB左右;有有效期,过期后将会删除;

本地存储:只有本地浏览器端可访问数据,服务器不能访问本地存储直到故意通过POST或者GET的通道发送到服务器;每个域5MB;没有过期数据,它将保留知道用户从浏览器清除或者使用Javascript代码移除。

3、HTML5 存储类型有什么区别?

答:html5的webstorage 分两种:LocalStorage 和SessionStorage,两者的差别主要在生命周期不同。

LocalStorage :LocalStorage用于持久化的本地存储,存储资料在客户端(client)的浏览器上,除非主动删除数据,否则数 据是永远不会过期的。LocalStorage使用键值对的方式进行存储,存储的方式只能是字符串。存储内容可以有图片、json、样式、脚本等只要可以 序列化为字符串的。SessionStorage:SessionStorage用于本地存储一个会话中 的数据,这些数据只有在同一个会话中的页面才能访问并且会话结束,例如关闭窗口后,,数据也会随之被销毁。它是一种会话级别的存储。

离线缓存(application cache):HTML5引入了应用程序缓存器,可对web进行缓存,在没有网络形况下使用,通过创建cache manifest文件,创建应用缓存。

4、行内元素有哪些?块级元素有哪些? 空(void)元素有那些?
答:行内元素:a  b  span  img  input  select  strong
块级元素:div  ul  ol  li  dl  dt  dd  h1  h2  h3  h4  p  等
空元素:<br>  <hr>  <img>  <link> <meta>

5、页面导入样式时,使用link和@import有什么区别?
答:i.link属于XHTML标签,而@import是css提供的;
ii.页面被加载时,link会同时被加载,而@import引用的css会等到页面被加载完再加载;
iii.@import只在IE5以上才能识别,而link是XHTML标签,无兼容问题;
iv.link方式的样式的权重高于@import的权重。

猜你喜欢

转载自blog.csdn.net/MySunshine07/article/details/82989639