<map> 标签用于定义客户端图像映射, 图像映射指的是带有可点击区域的图像。
<img src="planets.gif" alt="Planets" usemap ="#planetmap" />
<map name="planetmap">
<area shape ="rect" coords ="0,0,110,260" href ="sun.htm" alt="Sun" />
<area shape ="circle" coords ="129,161,10" href ="mercur.htm" alt="Mercury" />
<area shape ="circle" coords ="180,139,14" href ="venus.htm" alt="Venus" />
</map>
<map>应用场景, 解决链接嵌套的需求,注a标签是不能嵌套使用的
<a href="/book/1003477570/369104934" class="book-layout" target="_blank">
<img src="book.jpg" class="book-cover" alt="都市猎人 限时免费" usemap="#bookCover">
<map id="bookCover" name="bookCover">
<area shape="rect" coords="0,0,54,72" href="/book/1003477570" alt="都市猎人 限时免费" target="_blank">
</map>
<div class="book-cell">
<div class="book-title-x">
<h4 class="book-title">
<area class="area" href="/book/1003477570" target="_blank">
都市猎人
</h4>
<div class="book-title-r">继续阅读</div>
</div>
<div class="book-meta">都市猎人 | 读至第六百四十二章 不在意章</div>
<div class="book-meta">
<time class="book-meta-r">1天前</time>更新至 第六百四十二章 不在意
</div>
</div>
</a>
<video> 元素来包含视频的标准方法
<video src="movie.ogg" controls>
</video>
<auido> 元素来包含音频的标准方法
<auido src="movie.ogg" controls>
</auido>
页面一些事件
document.addEventListener("visibilitychange", function() {
//通过 document.visibilityState 的值检测页面当前是否可见，以及打开网页的时间等;
//在页面被切换到其他后台进程的时候，自动暂停音乐或视频的播放；
}）
document.addEventListener("storage", function() {
//当存储的storage数据发生变化时都会触发它，但是它不同于click类的事件会冒泡和能取消，storage改变的时候，触发这个事件会调用所有同域下其他窗口的storage事件，不过它本身触发storage即当前窗口是不会触发这个事件的（当然ie这个特例除外，它包含自己本事也会触发storage事件）。
//在使用 Storage 进行存取操作的同时，如果需要对存取操作进行监听，可以使用 HTML5 Web Storage api 内置的事件监听器对数据进行监控。只要 Storage 存储的数据有任何变动，Storage 监听器都能捕获。
//注意：在同一个网页修改本地存储，又在同一个网页监听，这样是没有效果的
//同一浏览器打开了两个同源页面
//其中一个网页修改了localStorage
//另一网页注册了storage事件
})
cookies，sessionStorage 和 localStorage 的区别？
cookie是网站为了标示用户身份而储存在用户本地终端（Client Side）上的数据（通常经过加密）。
cookie数据始终在同源的http请求中携带（即使不需要），也会在浏览器和服务器间来回传递。
sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。
存储大小: cookie数据大小不能超过4k, sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。
有期时间：
localStorage 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据
sessionStorage 数据在当前浏览器窗口关闭后自动删除
cookie 设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭
iframe有那些缺点?
iframe会阻塞主页面的Onload事件；
搜索引擎的检索程序无法解读这种页面，不利于SEO;
iframe和主页面共享连接池，而浏览器对相同域的连接有限制，所以会影响页面的并行加载。
使用iframe之前需要考虑这两个缺点。如果需要使用iframe，最好是通过javascript
动态给iframe添加src属性值，这样可以绕开以上两个问题。
浏览器内核的理解
主要分成两部分：渲染引擎(layout engineer或Rendering Engine)和JS引擎。
渲染引擎：负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入CSS等），以及计算网页的显示方式，然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要内核。
JS引擎：解析和执行javascript来实现网页的动态效果。
最开始渲染引擎和JS引擎并没有区分的很明确，后来JS引擎越来越独立，内核就倾向于只指渲染引擎
网友评论