xml地图|网站地图|网站标签 [设为首页] [加入收藏]

正规赌博十大app排名

当前位置:网上十大正规赌博平台 > 正规赌博十大app排名 > 总结JavaScript三种数据存储方式之间的区别,jQu

总结JavaScript三种数据存储方式之间的区别,jQu

来源:http://www.nb-machinery.com 作者:网上十大正规赌博平台 时间:2019-07-10 22:00

如果当前jQuery对象匹配多个元素:获取队列时,只获取第一个匹配元素上的队列;设置队列(替换队列、追加函数)时,则为每个匹配元素都分别进行设置。
该函数属于jQuery对象(实例)。如果需要移除并执行队列中的第一个函数,请使用dequeue()函数。你也可以使用clearQueue()函数清空指定的队列。

先给大家展示下效果图,具体效果图如下所示,如果大家觉得还不错,请参考实现代码:

sessionStorage 、localStorage 和 cookie 之间的共同点: 都是保存在浏览器端,且同源的。

语法 jQuery 1.2 新增该函数。queue()函数具有如下两种用法:

图片 1

sessionStorage 、localStorage 和 cookie 之间的区别: cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存。cookie数据还有路径(path)的概念,可以限制cookie只属于某个路径下。
存储大小限制也不同,cookie数据不能超过4k,同时因为每次http请求都会携带cookie,所以cookie只适合保存很小的数据,如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制,但比cookie大得多,可以达到5M或更大。
数据有效期不同,sessionStorage:仅在当前浏览器窗口关闭前有效,自然也就不可能持久保持;localStorage:始终有效,窗口或浏览器关闭也一直保存,因此用作持久数据;cookie只在设置的cookie过期时间之前一直有效,即使窗口或浏览器关闭。
作用域不同,sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面;localStorage 在所有同源窗口中都是共享的;cookie也是在所有同源窗口中都是共享的。
Web Storage 支持事件通知机制,可以将数据更新的通知发送给监听者。
Web Storage 的 api 接口使用更方便。

用法一:

代码如下:

封装的localStorage的方法,可以控制存储数据的条数,以及时间

jQueryObject.queue( [ queueName ] [, newQueue ] )
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery对话框右上角带关闭× - 何问起</title><base target="_blank" />
<!-- Attach our CSS -->
<link rel="stylesheet" href="http://hovertree.com/texiao/layer/1/reveal.css">
<!-- Attach necessary scripts -->
<script type="text/javascript" src="http://www.nb-machinery.com/uploads/allimg/190710/220021JK-1.jpg"></script>
<script type="text/javascript" src="http://www.nb-machinery.com/uploads/allimg/190710/220021Nc-2.jpg"></script>
<style type="text/css">
body {
font-family: "HelveticaNeue","Helvetica-Neue", "Helvetica", "Arial", sans-serif;
}
.big-link {
display: block;
margin-top: 50px;
text-align: center;
font-size: 30px;
background-color:#eeeeee;
color: #06f;
}
.hovertreeinfo{text-align:center;} .hovertreeinfo a{color:darkcyan;}
</style>
</head>
<body>
<div class="hovertreeinfo">
<h1>jQuery弹出可关闭层提示框</h1>
</div>
<a href="http://hovertree.com/h/bjaf/ati6k7yk.htm" class="big-link" data-reveal-id="myModal">
Demo 1
</a>
<a href="http://hovertree.com/hvtart/bjae/lhnydfey.htm" class="big-link" data-reveal-id="myModal" data-animation="fade">
Demo 2
</a>
<a href="http://hovertree.com/hvtart/bjae/vgte3y3a.htm" class="big-link" data-reveal-id="myModal" data-animation="none">
Demo 3
</a>
<div id="myModal" class="reveal-modal">
<h1>jquery导出层</h1>
<p>This is a default modal in all its glory, but any of the styles here can easily be changed in the CSS.
推荐使用Demo 1,和Demo 3两种方式。何问起 hovertree.com
</p>
<a class="close-reveal-modal">×</a>
</div>
<div class="hovertreeinfo">推荐使用Demo 1,和Demo 3两种方式.
<br />
<a href="http://hovertree.com/h/bjaf/tishiceng.htm">原文</a> <a href="http://hovertree.com">首页</a>
<a href="http://hovertree.com/texiao/">特效</a>
<br />by 何问起
hovertree.com
<br />
<!--<img src="http://www.nb-machinery.com/uploads/allimg/190710/22002145S-3.png" />-->
</div>
</body>
</html>
define(function (require) {
  var $ = require('jquery');
  var Cache = {};

  function support() {
    var _t = !(typeof window.localStorage === 'undefined');
    return _t;
  }


  $.extend(Cache, {
    config: {
      size: 5,
      // lifeTime: 86400 //一天的秒数
      lifeTime: 1*60
    },
    localStorage: window.localStorage,
    memQueue: (function () {
      if (support()) {
        var jsonStr = window.localStorage.getItem('LRUConfig');
        return jsonStr ? JSON.parse(jsonStr) : {
          keys: {},
          objs: []
        };
      } else {
        return {};
      }
    })(),

    get: function(appid, url) {
      if (true == support()) {
        var key = appid   ':'   url;
        //开始做LRU算法。
        this.LRU(key);
        //LRU算法结束。
        var isFresh = true;
        var nowTime = (new Date()).getTime() / 1000;
        if(key in this.memQueue.keys){
          var cacheTime = this.memQueue.keys[key].life / 1000;
          //如果过期时间超过 配置的lifeTime,
          //则清除掉当前缓存
          if(nowTime - cacheTime >= this.config.lifeTime){
            delete this.memQueue.keys[key];
            for (var i=0, len = this.memQueue.objs.length; i < len; i  ) {
              var _o = this.memQueue.objs[i];
              if(_o.key == key){
                this.memQueue.objs.splice(i,1);
                break;
              }
            }
            isFresh = false;
          }
        }
        //如果isFresh为假,就是已过期,则返回null,否则从localStorage中取
        return (false == isFresh) ? null : this.localStorage[key];
      }
    },
    set: function(appid, url, value) {
      if (true == support()) {
        var key = appid   ':'   url;
        var lruKey = this.getLRU();
        //淘汰最近最少使用的这个。
        //另外起一个方法读取最符合淘汰的这个
        //前提是当前这个key,不在localStorage里面。
        if (lruKey) {
          this.localStorage.removeItem(lruKey);
        }
        //开始设置一下这个值
        //为了兼容性,用以下方法设置
        if (typeof this.memQueue.objs != 'undefined' &&
          this.memQueue.objs.length <= this.config.size) {
          this.localStorage.removeItem(key);

        } else {
          while (this.memQueue.objs.length >= this.config.size) {
            var lruKey = this.getLRU();
            //淘汰最近最少使用的这个。
            //另外起一个方法读取最符合淘汰的这个
            if (lruKey) {
              this.localStorage.removeItem(lruKey);
              delete this.memQueue.keys[lruKey];
              for (var i = 0; i < this.memQueue.objs.length; i  ) {
                var _o = this.memQueue.objs[i];
                if(_o.key == lruKey){
                  this.memQueue.objs.splice(i,1);
                  break;
                }
              }
            }
          }
        }

        this.localStorage[key] = value;
        //当前的key,也必须lru一下
        this.LRU(key);
        //lru结束

        this.localStorage.setItem('LRUConfig', JSON.stringify(this.memQueue));
      }
    },
    /*
     * 近期最少使用算法
     */
    LRU: function(key) {
      var memQueue = this.memQueue;
      if (typeof memQueue.objs != 'undefined') {
        var _o = memQueue.objs;

        //开始计算那个要淘汰的key,
        //就是那个times最大的,如果times最大的有几个
        //则返回那个time最小的
        var isIn = false;
        for (var i = 0, len = _o.length; i < len; i  ) {
          _o[i].times = (key == _o[i].key) ? 0 : _o[i].times   1;
          _o[i].time = (key == _o[i].key) ? (new Date()).getTime() : _o[i].time;
          if(key == _o[i].key && false == isIn){
            isIn = true;
          }
        }
        // 如果
        if(false == isIn){
          var _to = {
            'key': key,
            'times': 0,
            'time': (new Date()).getTime(),
            'life': (new Date()).getTime()
          };
          this.memQueue.keys[key] = _to;
          this.memQueue.objs.push(_to);
        }
        _o.sort(function(f, s) {
          //按times降序排列。
          if (f.times < s.times) {
            return 1;
          } else if (f.times > s.times) {
            return -1;
          } else {
            //开始比较time
            //按time,时间升序排列
            if (f.time < s.time) {
              return -1;
            } else {
              return 1;
            }
          }
        });
      } else {
        this.memQueue.objs = [];
        this.memQueue.keys = {};
        var _to = {
          'key': key,
          'times': 0,
          'time': (new Date()).getTime(),
          'life': (new Date()).getTime()
        };
        this.memQueue.keys[key] = _to;
        this.memQueue.objs.push(_to);
        return null;
      }
    },
    /*
     * 读取需要淘汰的一项
     */
    getLRU: function() {
      var _o = this.memQueue.objs;
      if (_o) {
        return (_o.length >= this.config.size) ? _o.shift().key : null;
      }

      return null;

    }
  });


  return {
    'cache': Cache
  };
});

如果没有指定任何参数或只指定了queueName参数,则表示获取指定名称的函数队列。如果指定了newQueue参数,则表示使用新的队列newQueue设置(替换)当前队列中的所有内容。

以上所述是小编给大家介绍的jQuery代码实现对话框右上角菜单带关闭×的相关内容,希望对大家有所帮助!

使用方法

用法二:

您可能感兴趣的文章:

  • 基于jQuery实现带动画效果超炫酷的弹出对话框(附源码下载)
  • jQuery实现时尚漂亮的弹出式对话框实例
  • jquery插件hiAlert实现网页对话框美化
  • JQuery弹出炫丽对话框的同时让背景变灰色
  • jQuery实现单击按钮遮罩弹出对话框(仿天猫的删除对话框)
  • Jquery EasyUI中弹出确认对话框以及加载效果示例代码
  • jquery删除提示框弹出是否删除对话框
  • jQuery Mobile的loading对话框显示/隐藏方法分享
  • JQuery制作的放大效果的popup对话框(未添加任何jquery plugin)分享
  • Jquery实现页面加载时弹出对话框代码
  • 6款经典实用的jQuery小插件及源码(对话框/提示工具等等)
  • jQuery Dialog对话框事件用法实例分析
  • jquery实现点击弹出可放大居中及关闭的对话框(附demo源码下载)
var cache = require('cache');
// set 值
cache.Cache.set('ip', '你自己的一个url', value);

// get值
cache.Cache.get('ip')
jQueryObject.queue( [ queueName ,] callback )

您可能感兴趣的文章:

  • js 数据存储和DOM编程
  • 实现JavaScript高性能的数据存储
  • Ajax与用户交互的JSON数据存储格式
  • JavaScript数据存储 Cookie篇
  • javascript 数据存储的常用函数总结

将指定的函数添加到指定的队列(末尾)。
注意:queue()函数的所有设置操作针对当前jQuery对象所匹配的每一个元素;所有读取操作只针对第一个匹配的元素。

参数 请根据前面语法部分所定义的参数名称查找对应的参数。
queueName:可选/String类型指定的队列名称,默认为"fx"(表示jQuery中的标准动画效果队列)。
newQueue:可选/Array类型用于替换当前队列内容的新队列。
callback:Function类型指定的函数,将会追加到队列中。该函数有一个函数参数,调用该参数可以移除并执行队列中的第一个函数。

返回值 queue()函数的返回值是Array/jQuery类型,返回值的类型取决于当前queue()函数执行的是获取操作还是设置操作。
如果queue()函数执行的是设置操作(替换队列、追加函数),则返回当前jQuery对象本身;如果是获取操作,则返回获取到的函数队列(数组)。
如果当前jQuery对象匹配多个元素,读取数据时,queue()函数只以其中第一个匹配的元素为准。

**实例:

  1. jQuery为我们提供了queue()函数,来把你需要的某些代码插入到某个队列中
    **

本文由网上十大正规赌博平台发布于正规赌博十大app排名,转载请注明出处:总结JavaScript三种数据存储方式之间的区别,jQu

关键词: ag电子游戏排行

上一篇:实例讲解JavaScript的Backbone,新特性之get

下一篇:没有了