html5

今 天的目标 3.2:h5 新 特性 --WebStorage localStorage 在 客户端浏览器保 存 数据 永 久保存 保 存数据 localStorage [key] = value 保 存 数 据 localStorage.setItem(key,value); 获 取数据 var value = localStorage [key]; 获 取数据 var value = localStorage.getItem(key); 删 除数据 localStorage.removeItem(key); 删 除数据 localStorage.clear(); 数 据个数 localStorage.length 获 取 key var key = localStorage.key(i); 3.1:h5 新 特性 --WebSocket--代码 不复杂重点原理 HTTP协 议 : 属 于 " 请 求 - 响 应 " 模 型 , 只 有客户端 发 起请求，服务器才会响应 消 息，没 有 请求就没有响应，一个请求，只能得 到 一个响应。有 些 场景中 HTTP工 作模型 " 不适合 " "股 票走势图 " 解 决 方 案 -- 长 轮询 / 心 跳请求 WebSocket协 议 :"广 播 - 收 听 ",客 户端 连接到 服务器 就不再断开 , 永久 连接，双方随时向对方 发

最近写了一篇关于前端一些常见轻便耐用的UI框架的小总结，很多小伙伴私信问我，要怎么学习前端，没有明确的方向，为了感谢大家的关注点赞打赏和喜欢，决定把前端的学习进阶之路稍微整理一下，也为了自己能在工作之中思路更加的清晰。姑娘水平能力火候不够尚在学习中，如有不足，欢迎批评指正补充。 初级阶段 阿里矢量图标库：http://www.iconfont.cn/ ps使用教程：http://www.16xx8.com/ JavaScript教程：http://www.runoob.com/js/js-tutorial.html css教程：http://www.runoob.com/css/css-tutorial.html css3教程：http://www.runoob.com/css3/css3-tutorial.html HTML教程：http://www.runoob.com/html/html-tutorial.html HTML5教程：http://www.runoob.com/html/html5-intro.html jQuery 教程：http://www.w3school.com.cn/jquery/index.asp Ajax教程：http://www.runoob.com/ajax/ajax-intro.html HTTP1教程：http://www.runoob

项目介绍 背单词十分枯燥乏味，为了给广大英语学习者提供一个比较好的背英语模式和应用，我爱记单词应运而生。 我爱记单词是一款面向学生的背单词小程序，提供了丰富的单词词库以及好玩的背单词模式。 适合课间、地铁上、旅途中，任何碎片化时间，随时随地记单词。 用户群体 初高中生、大学生、英语爱好者等目标用户。 适合培训机构、新媒体、公众号团队等运营。 实现思路 本小程序基于云开发，用到了云数据库存储数据，使用云函数获取词库列表，随机获取单词词条，图片列表。 按批次拉取数据缓存到内存及localStorage中，实时对比输入内容与当前单词，基于图片奖励，继续循环下个单词。 图片数据：来源于微博。 单词词库：来源于百词斩。 流程图 效果图 部分代码实现 来源： oschina 链接： https://my.oschina.net/u/4634707/blog/4841509

第一阶段： HTML+CSS: HTML进阶、CSS进阶、div+css布局、HTML+css整站开发、 JavaScript基础： Js基础教程、js内置对象常用方法、常见DOM树操作大全、ECMAscript、DOM、BOM、定时器和焦点图。 JS基本特效： 常见特效、例如：tab、导航、整页滚动、轮播图、JS制作幻灯片、弹出层、手风琴菜单、瀑布流布局、滚动事件、滚差视图。 JS高级特征： 正则表达式、排序算法、递归算法、闭包、函数节流、作用域链、基于距离运动框架、面向对象基础、 JQuery：基础使用 悬着器、DOM操作、特效和动画、方法链、拖拽、变形、JQueryUI组件基本使用。 第二阶段：HTML5和移动Web开发 HTML5： HTML5新语义标签、HTML5表单、音频和视频、离线和本地存储、SVG、Web Socket、Canvas. CSS3: CSS3新选择器、伪元素、脸色表示法、边框、阴影、background系列属性改变、Transition、动画、景深和深透、3D效果制作、Velocity.js框架、元素进场、出场策略、炫酷CSS3网页制作。 Bootstrap: 响应式概念、媒体查询、响应式网站制作、删格系统、删格系统原理、Bootstrap常用模板、LESS和SASS。 移动Web开发： 跨终端WEB和主流设备简介、视口、流式布局、弹性盒子、rem

前言 前端早读课第十三期专访来了。曾回忆2010年时候看过他写的书，近段时间微博上的各种“撕逼”，以及广开收徒事情，让他站在了风口浪尖，有人支持，有人反对。那么今天我们就来看看阿当前辈在自己的前端生涯的经历。 正文从这开始～ 自我介绍，所服务的公司 我是曹刘阳，圈里的朋友们叫我阿当。现在在岗岭集团工作，互联网医疗领域。 你是基于什么情景上选择了前端工程师，以及在所服务的几个公司来看，你觉得哪一段经历对你影响最大，为什么？ 说来话长，大学时我的专业是计科系，学校里教些c啊、java啊、软件工程啊什么的，死活提不起兴趣，总觉得这玩意儿离看得见摸得着的“作品”有太大的距离。直到开了网页设计和photoshop这两门选修课，才眼睛一亮，觉得能做些什么了。另外，我读大学那会儿流行flash，闪客。我觉得这东西很好玩，就自学了flash。虽然很多人觉得c语言是最好的入门语言，但于我来说，真正为我打开编程之门的，却是as2，没错，flash的脚本语言。flash方便快捷，加上as2写脚本，不用太多的知识储备就能做出些好玩的东西了。如果不是因为flash在今天已经快退出历史舞台了，我仍然觉得它是编程入门最好的选择。 大学时我非常喜欢读书，主要是ps、flash和网页制作，当时网页制作方面的书low到不像话，经常都只告诉你如何操作dreamweaver，偶尔有一点讲js的也是xxx特效300例之类的

1. HTML常用标签 首先 HTML和CSS是两种完全不同的语言，我们学的是结构，就只写HTML标签，认识标签就可以了。 不会再给结构标签指定样式了。 HTML标签有很多，这里我们学习最为常用的，后面有些较少用的，我们可以查下手册就可以了。 1.1 排版标签 排版标签主要和css搭配使用，显示网页结构的标签，是网页布局最常用的标签。 1）标题标签h (熟记) 单词缩写： head 头部标题 title 文档标题 为了使网页更具有语义化，我们经常会在页面中用到标题标签，HTML提供了6个等级的标题，即 标题标签语义： 作为标题使用，并且依据重要性递减 其基本语法格式如下： <h1> 标题文本 </h1> <h2> 标题文本 </h2> <h3> 标题文本 </h3> <h4> 标题文本 </h4> <h5> 标题文本 </h5> <h6> 标题文本 </h6> 显示效果如下： 小结 : 加了标题的文字会变的加粗，字号也会依次变大 一行是只能放一个标题的 2）段落标签p ( 熟记) 单词缩写： paragraph 段落 [ˈpærəgræf] 无须记这个单词 作用语义： 可以把 HTML 文档分割为若干段落 在网页中要把文字有条理地显示出来，离不开段落标签，就如同我们平常写文章一样，整个网页也可以分为若干个段落，而段落的标签就是 <p> 文本内容 </p>

面试过不少前端从业者，简历写的平平淡淡，别人会的技能他也都会，看起来什么都掌握一些；有些会请过来当面聊一下，有些就直接拒绝了（如果是公司内要求独立完成项目的岗位，简历里放很多学习时候的DEMO项目，没有真实上线的项目，这种简历一般都会拒绝掉）。 当我们去一家公司面试，面试官有很大的主动权，面试官属于攻击方，求职者属于防守方，我们不可能什么方向都研究的非常深，所以扬长避短是最好的方式，推荐大家要做帐篷型的人，而不是水桶型的人；市场上岗位非常多，我们需要做的就是找到适合自己长处发展的那个职业！ 面试的时候一定不要和面试官硬刚，可以适度的夸大自己，但是一定不要以为自己技术牛，就疯狂装B；面试官非常希望找到和自己脾气相投的人一起共事，哪怕你真的是万里挑一的大牛，面试官感觉和你一起共事非常不舒服，那么拒绝你也不是什么太难的决定。 如果遇到自己期望薪资内的offer，一定不要犹豫，直接答应下来，但是入职的时间，可以稍微向后推一下，可以一个礼拜后，十天后等，这段时间再继续面试，这时候薪资就一定要找高于自己答应offer的薪资，如果期间遇到自己更加满意的offer，就在自己答应的offer里找一家自己最感兴趣的入职。 目录 HTML 面试题 CSS 面试题 JavaScript 面试题 网络通信面试题 jQuery 面试题 Vue.js 面试题 React.js 面试题 工具面试题 算法面试题

主要实现方式：使用H5的video 元素结合H5的网络频播放器（video.js）实现rtmp流的直播播放 video.js 介绍 Video.js 是一个通用的在网页上嵌入视频播放器的 JS 库，Video.js 自动检测浏览器对 HTML5 的支持情况，如果不支持 HTML5 则自动使用 Flash 播放器。 优点： 1.它是开源免费的，你可以在github很容易的获取它的最新代码。 2.使用它非常的容易，只要花几秒钟就可以架起一个视频播放页面。 3.它几乎兼容所有的浏览器，并且优先使用html5，在不支持的浏览器中，会自动使用flash进行播放。 4. 界面可以定制，纯javascript和css打造。说明文档也非常的详细。 注：html5的video标签只支持mp4、webm、ogg三种格式，不支持flv，flash格式， flv格式是flash专用的，rtmp流为flv格式的，必须使用flash播放器，在video.js内部可以检测浏览器是否支持html5播放器直接播放，如果不支持内部会自动调用浏览器的flash播放器播放视频。Edge、谷歌浏览器中网站默认是禁用flash的，手动设置为允许flash即可 代码示例 1 <! DOCTYPE html > 2 < html > 3 < head > 4 < meta charset ="UTF-8" > 5 < title

1.请你谈谈Cookie的优缺点 优点：极高的扩展性和可用性 数据持久性。 不需要任何服务器资源。 Cookie 存储在客户端并在发送后由服务器读取。 可配置到期规则。 控制 cookie 的生命期，使之不会永远有效。偷盗者很可能拿到一个过期的 cookie 。 简单性。 基于文本的轻量结构。 通过良好的编程，控制保存在 cookie 中的 session 对象的大小。 通过加密和安全传输技术（ SSL ），减少 cookie 被破解的可能性。 只在 cookie 中存放不敏感数据，即使被盗也不会有重大损失。 缺点： Cookie 数量和长度的限制 。 数量：每个域的 cookie 总数有限。 a) IE6 或更低版本最多 20 个 cookie b) IE7 和之后的版本最后可以有 50 个 cookie c) Firefox 最多 50 个 cookie d) chrome 和 Safari 没有做硬性限制 长度：每个 cookie 长度不超过 4KB （ 4096B ），否则会被截掉。 潜在的安全风险 。 Cookie 可能被拦截、篡改。如果 cookie 被拦截，就有可能取得所有的 session 信息。 用户配置为禁用 。有些用户禁用了浏览器或客户端设备接受 cookie 的能力，因此限制了这一功能。 有些状态不可能保存在客户端 。例如，为了防止重复提交表单

　　2020年,注定成为 　　人类历史上 　　不平常的一年 　　这一年,各行各业都发生了 　　巨大改变 　　数据保护领域 　　亦是如此 　　数据增长和病毒肆虐 　　数据保护举措却没有跟上 　　2020年最新出炉的全球数据保护指数研究报告表明: 　　组织管理的数据平均增加了39%,而在2018年至2019年期间,宕机的平均成本增加了54%,98%的组织正在投资新兴技术,但又有71%的组织认为新兴技术会加大数据保护复杂性。 　　这些变化都表明在当前数据化转型大潮中,众多客户都碰到数据量增长过快、新的业务需要更多新兴技术的支撑,但同时又面临着如何保证数据安全的问题。所以全球数据保护指数报告的结论是:持续保护现在与未来的数据是一个组织持续发展的必要条件。 　　第三方调研机构ESG(Enterprise Strategy Group) 曾针对应用程序宕机或数据丢失会对客户的组织造成的影响进行了调研,结果发现一旦发生数据丢失,对于组织员工信心和生产力的影响,以及对于客户信心的影响都是巨大的,这些影响很难用金钱来衡量。 　　现实生活中造成数据丢失的原因非常多,比如硬件故障,应用软件升级可能带来的影响等等,这些原因大多数是可以进行预防和有回退预案的。 　　而令人防不胜防的是猖獗无比的勒索病毒造成的数据丢失。就在今年2月和3月新冠病毒疫情最严重的时期,勒索病毒邮件的增长为4000%,真是令人谈毒色变