大V

最新推荐文章于 2022-10-15 11:44:25 发布
原创最新推荐文章于 2022-10-15 11:44:25 发布 · 223 阅读
CC 4.0 BY-SA版权
<!DOCTYPE html>
<html>
<head>
	<title>电脑登录</title>
</head>
<body>

</body>
<script type="text/javascript">
	/*我们可以看到属性a有两个相对应的get和set方法，为什么会多出这两个方法呢？因为vue是通过Object.defineProperty()来实现数据劫持的。
	*/
var Book = {}
var name = '';
Object.defineProperty(Book, 'name', {
  set: function (value) {
    name = value;
    console.log('你取了一个书名叫做' + value);
  },
  get: function () {
    return '《' + name + '》'
  }
})
 
Book.name = 'vue权威指南';  // 你取了一个书名叫做vue权威指南
console.log(Book.name);  // 《vue权威指南》

/*熟悉了animation的属性之后，得找个简单的小项目实现下，逐帧动画好有意思，先跑一个满足下自己
思路很简单，就是给元素一个雪碧图的背景，然后添加的帧动画更改background-position，关键代码*/
@keyframes run{   

    from{   

        background-position: 0 0;   

    }   

    to{   

        background-position: -1540px 0 ;   

    }   

}   

p{   

    width:140px;   

    height:140px;   

    background: url(run.png) ;   

    animation-name：run;   

    animation-duration:1s;   

    animation-iteration-count:infinite;   

}
但是跑起来后我们发现，每帧动画之间帧动画都是滑动，并不是我们要的效果,为什么呢？
原来animation默认以ease方式过渡，它会在每个关键帧之间插入补间动画，所以动画效果是连贯性的
知道原因就好办了，解决思路就是
@keyframes run{   

    0%, 8%{  /*动作一*/  }   

    9.2%, 17.2%{  /*动作二*/  }   

    ...   

}
step1：动作之间停留8帧，0%设置动作一，动作一结束在8%
step2：动作之间过渡1.2帧，9.2%设置动作二，动作二结束在17.2%;
1. cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。

2. cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下。存储大小限制也不同，cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据，如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。

3. 数据有效期不同，sessionStorage：仅在当前浏览器窗口关闭前有效，自然也就不可能持久保持；localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。

4. 作用域不同，sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。Web Storage 支持事件通知机制，可以将数据更新的通知发送给监听者。Web Storage 的 api 接口使用更方便。
主要有三个区别：
html5和html有什么区别啊？
1、文档声明区别

HTML：超文本标记语言，一种纯文本类型的语言。

HTML5.0：文档声明HTML5方便书写，精简，有利于程序员快速的阅读和开发。

2、结构语义区别

html：没有体现结构语义化的标签，如：<div id="nav"></div>

html5：添加了许多具有语义化的标签，如：<article>、<aside>、<audio>、<bdi>...

3、绘图区别

HTML：指可伸缩矢量图形，用于定义网络的基于矢量的图形。

HTML5：HTML5的canvas元素使用脚本（通常使用JavaScript）在网页上绘制图像，可以控制画布每一个像素。
建议：html5.0是html的升级，如果是初学还是先学html;
 localStorage.setItem(key,JSON.stringify({val:value,time:curtime}));//转换成json字符串序列
 JSON.parse用于从一个字符串中解析出json对象
 1、html5几种存储形式
   本地存储（localStorage && sessionStorage）
   离线缓存（application cache）
   indexedDB 和 webSQL
2、localStorage && sessionStorage
   过期时间：localStorage 永久存储，永不失效除非手动删除
                 sessionStorage 浏览器重新打开后就消失了
   大小：每个域名是5M
3、localStorage API和sessionStorage API一致
   getItem //取记录
   setIten//设置记录
   removeItem//移除记录
   key//取key所对应的值
   clear//清除记录
   js每声明一个function，都有prototype原型，prototype原型是函数的一个默认属性，在函数的创建过程中由js编译器自动添加。
</script>
</html>