
Html5
桃子阿哥
希望能成为一个很有钱的老板, 可以让我的员工有双休, 有六险一金, 朝九晚五, 偶尔加班, 每个人带着希望去工作
展开
-
前端本地存储的 cookie 和 localstorage 的对比
传统 cookiesessionH5 的本地存储: localstorage 和 sessionstoragecookie:http 无状态不持久前端和后端进行数据交互的时候, 是用 http 请求, 但是 http 是一种无状态的协议, 无状态的意思就是收到一个请求, 返回一个相应, 而不关心请求者的身份. http 也不是一种持久性的链接, 对于请求来说, 记住某用户的身份比较困难.然后就出现了 cookie, 就是为了在用户端保存用户身份, 浏览器会在操作系统里开辟一个文件, 专门存放原创 2020-09-29 14:31:05 · 1247 阅读 · 0 评论 -
dns-prefetch和浏览器解析过程
dns-prefetch<head> <meta charset="utf-8"> <link rel="dns-prefetch" href="//cdn.xxx.com"></head>页面一加载, 就立即把 href 里指定的域名做 dns 查询然后缓存起来, 等真正请求这些域名下资源的时候, 就省去了 dns 查询时间, 提高页面加载速度资源请求浏览器 < ------ > 后端服务器请求的资源可以是 HTML, C原创 2020-09-28 20:08:33 · 215 阅读 · 0 评论 -
WebGL简单绘制图形的两种方法
第一种方法跟canvas相似 , 不常用.step1: 添加一个画布元素step2: 获取到画布元素的基于webgl的上下文环境对象step3: 使用对象的api<body> <canvas id="pic" width="200" height="200" style="border: dashed 1px solid"></canvas> <script type="text/javascript"> //原创 2020-08-12 00:03:26 · 972 阅读 · 0 评论 -
canvas 简易刮刮卡效果
思路:设置画布随机生成卡片内容. 注意是随机使用图层覆盖卡片内容鼠标拖动实现刮卡效果<body> <!-- 1. 设置一块画布 --> <canvas id="pic" style="border:solid 1px #ccc"></canvas> <script type="text/javascript"> // 获取画布元素 const pic = document.getEleme原创 2020-08-05 22:45:04 · 231 阅读 · 0 评论 -
Canvas简介-- 画矩形和圆形及实现图片部分放大或缩小
绘制矩形apistrokeRect(x,y,width,height) // 无填充效果, 仅有边框fillRect(x,y,width,height) // 有填充clearRect(x,y,width,height) // 清除效果绘制圆形apiarc(x,y,r,sAngle, eAngle, clockwise) // x,y 代表圆心点坐标, r 半径, sAngle 起始角度, eAngle 结束角度, clockwise 顺时针绘制(默认为false,也就是顺时针, 设置为原创 2020-08-05 21:03:50 · 893 阅读 · 0 评论 -
Canvas简介-- 简单画一条直线及基础api
Canvas元素是H5新特性之一, 可以通过脚本渲染图像以下摘自W3school:HTML5 标签用于绘制图像(通过脚本,通常是 JavaScript)。不过, 元素本身并没有绘制能力(它仅仅是图形的容器) - 您必须使用脚本来完成实际的绘图任务。getContext() 方法可返回一个对象,该对象提供了用于在画布上绘图的方法和属性。简单用canvas画一个直线步骤:获取画布容器元素 (设置一个画布)获取canvas的工具集定位开始点浏览器坐标系跟我们高中坐标系学的相反, 屏幕原创 2020-08-05 16:01:13 · 422 阅读 · 0 评论