HTML5

1. h5开发,它指的是什么?和 HTML5有什么关系?

  • HTML5是一项标准,是HTML语言标准的第五次升级,不是单一的技术,浏览器对标准的支持程度不一;所以要么按理论去讨论HTML5标准,要么按实践去讨论HTML5标准在浏览器的应用(诸如<video>等新标签);
  • H5是一个解决方案,一个技术集合,而不是具体的技术,当讨论H5时,通常是要运用各种前端技术做出酷炫的移动端单页面应用;
  • H5是产品名词,HTML5是技术名词,两者并没有任何关系,如果要做H5酷炫应用,用HTML4也可以完成。

百度 H5
QQ H5
H5 知乎


2. HTML5是什么?有哪些新特性?有哪些新增标签?如何让低版本的 IE 支持 HTML5新标签

  • HTML5是HTML标记语言的第五次升级标准;
  • 增加了语义化的标签、新的属性、支持视频音频的嵌入、全面支持CSS3、2D/3D制图、本地存储、web应用;
  • 新增标签:
    • <canvas>标签定义图形,比如图表和其他图像;
    • <audio>定义音频内容;
    • <video>定义视频内容;
    • <source>定义多媒体资源<audio>和<video>;
    • <embed>定义嵌入内容,比如插件;
    • <track>为诸如 <video> 和 <audio> 元素之类的媒介规定外部文本轨道;
    • <datalist>定义选项列表。与 input 元素配合使用该元素,来定义 input 可能的值;
    • <keygen>规定用于表单的密钥对生成器内容;
    • <output>定义不同类型的输出,比如脚本的输出;
    • <article>定义页面内独立的内容区域;
    • <aside>定义页面的侧边栏内容;
    • <dialog>定义对话框,比如提示框;
    • <figure>定义独立的流内容;
    • <footer>定义 section 或 document 的页脚;
    • <section> 定义文档中的节(section、区段);
    • <time>定义日期或时间;
    • 更多
  • 让低版本IE浏览器兼容HTML5,可以借用html5shiv:
 <head>
    <!--[if lt IE 9]>
    <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
    <![endif]-->
  </head>

3. input 有哪些新增类型?

  • color —— 从拾色器选择颜色;
  • date —— 允许从一个日期选择器选择一个日期;
  • datetime —— 允许选择一个日期(UTC 时间);
  • datetime-local —— 允许选择一个日期和时间 (无时区);
  • email —— 在提交表单时,会自动验证 email 域的值是否合法有效;
  • month —— 定义月与年 (无时区);
  • number —— number 类型用于应该包含数值的输入域(带一些控制数值的属性);
  • range —— 定义一个不需要非常精确的数值(类似于滑块控制);
  • search —— 定义一个搜索字段 (类似站点搜索或者Google搜索);
  • tel —— 定义输入电话号码字段;
  • time —— 定义可输入时间控制器(无时区);
  • url —— url 类型用于应该包含 URL 地址的输入域,在提交表单时,会自动验证 url 域的值;
  • week—— 定义周和年 (无时区);

参考


4. 浏览器本地存储中 cookie 和 localStorage 有什么区别? localStorage 如何存储删除数据。

特性 Cookie localStorage sessionStorage
数据的生命期 一般由服务器生成,可设置失效时间。如果在浏览器端生成Cookie,默认是关闭浏览器后失效 除非被清除,否则永久保存 仅在当前会话下有效,关闭页面或浏览器后被清除
存放数据大小 4K左右 一般为5MB 同上
与服务器端通信 每次都会携带在HTTP头中,如果使用cookie保存过多数据会带来性能问题 仅在客户端(即浏览器)中保存,不参与和服务器的通信 同上
易用性 需要程序员自己封装,源生的Cookie接口不友好 源生接口可以接受,亦可再次封装来对Object和Array有更好的支持 同上

localStorage的使用:

    // 存储数据
    localStorage.setItem('name', 'zhao');
    // 获取数据
    localStorage.getItem('name');
    localStorage.name;
    // 删除数据
    localStorage.removeItem('name');

参考:详说 Cookie, LocalStorage 与 SessionStorage


Coding:

标签可在“全部”和“订阅"两个栏目来回拖动:
预览
代码


本文归本人和饥人谷所有,如需转载请注明来源,谢谢

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,732评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,496评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,264评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,807评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,806评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,675评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,029评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,683评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 41,704评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,666评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,773评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,413评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,016评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,978评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,204评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,083评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,503评论 2 343

推荐阅读更多精彩内容

  • 接上 关于HTML/HTML5(一)http://www.jianshu.com/p/33fc7840c079 学...
    Amyyy_阅读 776评论 0 4
  • HTML5 标签comment 注释标签用于在源文档中插入注释。注释内容不会被浏览器显示。为代码编写注释的好处是...
    才気莮孒阅读 4,039评论 1 25
  • 转载请声明 原文链接 关注公众号获取更多资讯 这篇文章主要总结H5的一些新增的功能以及一些基础归纳,这里只是一个提...
    程序员poetry阅读 9,057评论 22 225
  • HTML5 第一章 HTML5概述 H5是下一代的web开发的基础. 1.1 web技术发展时间线 1991 HT...
    whitsats阅读 1,019评论 0 0
  • 学习HTML的最佳网站没有之一http://www.w3school.com.cn/html/ 关于HTML/HT...
    Amyyy_阅读 2,036评论 0 16