乐趣区

关于html5:html5

jiezi

HTML5 是最新的 HTML 规范，是万维网联盟（W3C）和网络超文文本利用工作组（WHATWG）单干输入的。目前高版本浏览器曾经可用了，然而低版本浏览器未反对

HTML5 的文档类型是 <! doctype html>

1、新增的语义化标签

  1. <header>：页眉，即为头部标签
  2. <nac>：导航栏标签
  3. <article>：内容标签
  4. <section>：定义文档某个区域
  5. <aside>：侧边栏标签
  6. <footer>：页脚，即尾部标签

这些语义化标签是针对搜索引擎的，有利于SEO，能够屡次应用，倡议多应用这个，不要满屏都是div

2、多媒体标签

视频标签

<video src='文件地址' controls='controls'></video>

音频标签

<audio src='文件地址' controls='controls'></audio>

3、新增的 input、表单控件

新增的 input 类型

重点记住：number、tel、search

新增 type 类型

autocomplete属性 默认是 autocomplete=on 即曾经关上，表单须要加上 name 属性，同时胜利提交

个别咱们都会设置 autocomplete="off"，因为咱们不想让已经搜寻过的信息显示进去，爱护隐衷

4、两种存储

HTML5 为浏览器提供了两种数据存储计划：sessionStorage 和 localStorage

sessionStorage

sessionStorage 用于在本地存储一个会话中的数据，这些数据只有在同一个会话中的页面能力拜访，当会话完结后，数据也会随着销毁。因而 sessionStorage 不是一种长久化的本地存储，仅仅是会话级别的存储

localStorage

localStorage 是一种长久化的本地存储，除非被动删除数据，否则数据是永远不会过期的

另外，localStorage是存储在 Web 服务器的

localStorage 属性容许在浏览器中存储 键值对（key-value）的数据，必须是以键值对的模式存储，而且必须是以字符串的模式存储

保留 / 写入数据：

window.localStorage.setItem('key', 'value')

读取数据：

let getItem = window.localStorage.getItem('key')

删除数据：

window.localStorage.removeItem('key')

革除所有内容：

window.localStorage.clear()

考点：

1、如何解决 HTML5 新标签的浏览器兼容问题？

IE8、IE7、IE6 反对用 document.create Element 产生标签，能够利用这一个性让这些浏览器反对 HTML5 新标签

当然，最好的形式是间接应用水平的框架，应用最多的是 html5shim 框架，能够用 IE hack 引入框架

<！--[if 1t IE 9]>
<script>src="http://html5shim.googlecode.com/svn/trunk/htm15.js</script>
<！[end if]-->

2、为什么 HTML5 外面不须要 DTD（文档类型定义）？如果不放入 <! doctype html> 标签，会怎么？

HTML5 没有应用 SGML 或者 XHTML，它是一个全新的类型，因而不须要参考 DTD。对于 HTML5，进须要搁置文档类型代码<! doctype html>，让浏览器可能辨认 HTML5 文档

所以不放入 <! doctype html> 标签，HTML5 不会工作，浏览器不能辨认出它是 HTML 文档，同时 HTML5 的标签将不能失常工作

3、HTML5 中的利用缓存是什么？

HTML5 利用缓存的最终目标是帮忙用户离线浏览页面。换句话说，如果网络连接不可用，关上的页面就是来自浏览器缓存的，离线利用缓存能够帮忙用户达到这个目标

所以，利用缓存有 3 个劣势：

  1. 离线浏览，让用户可在离线时应用它们
  2. 速度，让已缓存的页面加载更快
  3. 缩小服务器负载，让浏览器只下载服务器更新过的资源

4、如何实现浏览器内多个标签页之间的通信？

在标签页之间，调用 localStorage、cookies 等数据存储，能够实现标签页面之间的通信

5、localStorage 和 cookie 的区别

cookie 是不能够或缺的，因为 cookie 的作用是跟服务器进行交互，并且是 HTTP 标准的一部分

  • cookie 的大小是受限的，大概只能 4KB
  • cookie 有生命周期
  • 每次申请一个新页面时，cookie 都会被发送过来的，这样无形中节约了带宽
  • 另外，cookie 还须要指定作用域，而且要读写也要本人封装 setCookie、getCookie等

localStorage是为了更大容量的存储而设计的

  • localStorage 存储空间是 5M 甚至更多
  • localStorage永久性存储
  • localStorage 领有本人的读写办法，不必本人封装

不过两者还是由共同点的：

  • 都存储在浏览器端
  • 都是同源
退出移动版