千家信息网

请输入关键字词

热门搜索排行

最新搜索排行

导航： 首页 > 开发技术 >

如何进行JQuery插件的开发

发表于：2024-12-13 作者：千家信息网编辑
千家信息网最后更新 2024年12月13日，这期内容当中小编将会给大家带来有关如何进行JQuery插件的开发，文章内容丰富且以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。【前言】jQuery已经被广泛使用，凭借其简洁的API
千家信息网最后更新 2024年12月13日如何进行JQuery插件的开发

这期内容当中小编将会给大家带来有关如何进行JQuery插件的开发，文章内容丰富且以专业的角度为大家分析和叙述，阅读完这篇文章希望大家可以有所收获。

【前言】
jQuery已经被广泛使用，凭借其简洁的API，对DOM强大的操控性，易扩展性越来越受到web开发人员的喜爱，我在社区也发布了很多的jQuery插件，经常有人询问一些技巧，因此干脆写这么一篇文章给各位jQuery爱好者，算是抛砖引玉吧。

【基础】
a)样式
很多人会认为样式是个很复杂的东西，需要沉着冷静的心态加上非凡的审美观才能设计出赏心悦目的UI，抛开图片设计不说，其实css也就是那么些属性：position,margin,padding,width,height,left,top,float,border,background...

UI设计的漂亮与否在很大程度上依赖于设计人员对配色的把握和整体效果的协调。举个简单的例子，一个简单的页面，马虎的人：

      Test Pagetitle> head> <body>     jQuery是一个框架！压缩后有30多k吧。  body> html></pre><p>细心的人：</p><pre><html xmlns="http://www.w3.org/1999/xhtml"> <head>     <title>Test Pagetitle>     <style type="text/css">         body          {              font-family:'宋体';              font-size:12px;              }      style> head> <body>     jQuery是一个框架！压缩后有30多k吧。  body> html></pre><p>专心的人：</p><pre><html xmlns="http://www.w3.org/1999/xhtml"> <head>     <title>Test Pagetitle>     <style type="text/css">         body          {              font-family:'Verdana','宋体';              font-size:12px;              }      style> head> <body>     jQuery是一个框架！压缩后有30多k吧。  body> html></pre><p>我们对比一下三者的UI效果：<br><br><img src='https://www.aqdb.cn/uploadfile/c1/3c28ddc3.jpg' /><br><img src='https://www.aqdb.cn/uploadfile/e4/0d6f96ef.jpg' /><br>一目了然，或许很多的站点失去关注正是因为这不起眼的font-family,font-size。当然这还只是个简单的例子，掌握css应该从简单做起，从基本入手，在实践中运用并不断深入。</p><p>b)脚本<br>我们同样需要对javascript有着深刻的理解，对dom, xhr, Regex, call-apply, prototype等都应该有一定的了解。</p><p>有人会说要这些有啥用啊，对dom的操作其实通过getElementById, getElementsByTagName以及其他的API都可以轻松的完成，这话是没错，当思路确定后，思想才是重点，一段代码是精华还是糟粕很容易就可以区分出来，究其原因还是取决你自己，举个简单的例子，大量的html组装，</p><p>路人甲：</p><pre>var a = new Array(10);  var menu = '';     for (var i = 0; i < a.length; i++) {    menu += '' + a[i] + '" >' + a[i] + '';  }</pre><p>路人乙：</p><pre>String.prototype.format = function() {      var args = arguments;      return this.replace(/{(\d{1})}/g, function() {          return args[arguments[1]];      });  };   var a = new Array(1,2,3,4,5,6,7,8,9,0);  var m = '{0}';   for (var i = 0; i < a.length; i++) {      menu += m.format(a[i]);  }</pre><p>在实现方式明确的情况下，优雅高效的代码显然更具吸引力。</p><p>【实践】<br>jQuery开发或使用，更多的灵感是来自实践，而不是copy||paste(奉行拿来主义的同学可以离开了)。</p><p>那么在这里我会用一个简单的例子来阐述jQuery插件开发的流程，能否举一反三就看各位看官了。</p><p>【目的】</p><p>开发一个插件之前我们需要对自己的目的有一个清醒的认识，有很明确的方向感，那么此次我作为示例插件的目的，就是呈现一个用于UI的Slider - 滑动条，常年从事于或暂时专注于win32开发的同学应该比较了解。</p><p>草图</p><p>真正动手编码之前我们还需要有一个草图来描述自己插件的"长相"（事件驱动或API封装的可以忽略）。<br>很多的同学在做UI开发前往往会忙于搜集各种小图片(非精通ps或iconworkshop人士)，其实漂亮的图标的确可以美化我们的UI，不过我一般的处理方式是编写易于扩展的css，前期的UI呈现尽量少使用图片，多用线条完成。</p><p>ok，言归正卷，那么我的slider设计草图是:</p><p></p><p>解释下下文将用到的几个词：<br>slider: 此部分是作为拖拽手柄来使用，用户可以通过拖拽此部分来更新completed bar的位置。<br>completed: 此部分作为bar的内嵌元素，作为特殊效果来显示slider与起始点的距离，亦即与slider的value值关联。<br>bar: slider的载体，completed的满值。</p><p>思路：<br>slider作为手柄提供拖拽功能，作用区域为bar，拖拽过程中completed条必须实时更新(长度)，影响区域为slider至bar左端的距离。</p><p>【编码】</p><p>开发jQuery UI/Effect 插件在很多时候都需要与UI交互，因此在呈现上需要提供Html tree来绘制我们的插件，最终通过js dom来输出，那么在绘制简单的dom结构的时候我会直接用js来完成，不过如果嵌套比较复杂的话，我们还是应该先用html来完成，然后转变成js输出。</p><p>html tree:</p><pre><div class="defaultbar">   <div class="jquery-completed"> div>   <div class="jquery-jslider"> div> div></pre><p>deafultbar -> bar<br>jquery-completed -> completed<br>jquery-jslider -> slider</p><p>前期UI呈现上我们不使用图片，尽量用线条、颜色来完成：</p><pre>/*----default skin----*/  .defaultbar  {      margin-top: 10px;      height: 5px;      background-color: #FFFFE0;      border: 1px solid #A9C9E2;      position: relative;      }  .defaultbar .jquery-completed  {      height: 3px;      background-color: #7d9edb;      top: 1px;      left:1px;      position: absolute;      }  .defaultbar .jquery-jslider  {      height: 15px;      background-color: #E6E6FA;      border: 1px solid #A5B6C8;      top: -6px;      display: block;      cursor: pointer;      position: absolute;      }</pre><p>将bar的position属性设置成relative，以方便子节点的浮动（子节点使用position:absolute来获得内联浮动效果）。</p><p>那么我们可以看下这个css和html tree产生的UI效果：<br></p><p>ok,具备了所需的元素 - slider, completed, bar.</p><p>一些规范:</p><p>当我们画出了UI之后就可以正式编写jQuery插件代码了，不过在着之前我们还需要对jQuery插件开发的一些规范性有一些了解。</p><p><strong>1. 使用闭包：</strong></p><pre>(function($) {    // Code goes here  })(jQuery);</pre><p>这是来自jQuery官方的插件开发规范要求，使用这种编写方式有什么好处呢？</p><p>a) 避免全局依赖。</p><p>b) 避免第三方破坏。</p><p>c) 兼容jQuery操作符'$'和'jQuery '</p><p>我们知道这段代码在被解析时会形同如下代码：</p><pre>var jq = function($) {    // Code goes here  };   jq(jQuery);</pre><p>这样效果就一目了然了。</p><p><strong><span>2. 扩展</span></strong></p><p>jQuery提供了2个供用户扩展的‘基类’ - $.extend和$.fn.extend.</p><p>$.extend 用于扩展自身方法，如$.ajax, $.getJSON等，$.fn.extend则是用于扩展jQuery类，包括方法和对jQuery对象的操作。为了保持jQuery的完整性，我比较趋向于使用$.fn.extend进行插件开发而尽量少使用$.extend.</p><p><strong><span>3. 选择器</span></strong></p><p>jQuery提供了功能强大，并兼容多种css版本的选择器，不过发现很多同学在使用选择器时并未注重效率的问题。<br><br>a) 尽量使用Id选择器，jQuery的选择器使用的API都是基于getElementById或getElementsByTagName，因此可以知道效率***的是Id选择器，因为jQuery会直接调用getElementById去获取dom，而通过样式选择器获取jQuery对象时往往会使用 getElementsByTagName去获取然后筛选。<br><br>b) 样式选择器应该尽量明确指定tagName, 如果开发人员使用样式选择器来获取dom，且这些dom属于同一类型，例如获取所有className为jquery的div，那么我们应该使用的写法是$('div.jquery')而不是$('.jquery')，这样写的好处非常明显，在获取dom时jQuery会获取div然后进行筛选，而不是获取所有dom再筛选。</p><p>c) 避免迭代，很多同学在使用jQuery获取指定上下文中的dom时喜欢使用迭代方式，如$('.jquery .child')，获取className为jquery的dom下的所有className为child的节点，其实这样编写代码付出的代价是非常大的，jQuery会不断的进行深层遍历来获取需要的元素，即使确实需要，我们也应该使用诸如$(selector,context), $('selector1>selector2'), $(selector1).children(selector2), $(selctor1).find(selector2)之类的方式。</p><p>开始编码</p><p>话题有点扯远，ok，在对UI有了清晰的认识后我们就可以使用js来输出html了。</p><p>我们使用jSlider来命名这个slider插件(为了避免插件冲突，插件命名时也应十分考究，这里我就俗一回)。</p><pre>$.extend($.fn, {          ///          /// apply a slider UI          ///          jSlider: function(setting) {          }  });</pre><p>在插件开发中比较标准的方式是将元数据独立出来并开放API，比如这里的setting参数传入值，有时候为了减少代码编写量，我习惯于直接在插件内赋值：</p><pre>var ps = $.extend({      renderTo: $(document.body),      enable: true,      initPosition: 'max',      size: { barWidth: 200, sliderWidth: 5 },      barCssName: 'defaultbar',      completedCssName: 'jquery-completed',      sliderCssName: 'jquery-jslider',      sliderHover: 'jquery-jslider-hover',      onChanging: function() { },      onChanged: function() { }  }, setting);</pre><p>规范的做法：</p><pre>$.fn.jSlider.default = {      renderTo: $(document.body),      enable: true,      initPosition: 'max',      size: { barWidth: 200, sliderWidth: 5 },      barCssName: 'defaultbar',      completedCssName: 'jquery-completed',      sliderCssName: 'jquery-jslider',      sliderHover: 'jquery-jslider-hover',      onChanging: function() { },      onChanged: function() { }      };   $.extend({},$.fn.jSlider.default,setting);</pre><p>ok, 下面描述下我所定义的这些API的作用：<br>renderTo: jSlider的载体、容器，可以是一个jQuery对象，也可以是选择器。<br>enable: jSlider插件是否可用，true时end-user可拖拽，否则禁止。<br>initPosition: jSlider的初始值，‘max’或者‘min’，亦即 slider的value值，1或者0。<br>size: jSlider的参数，包括2个值barWidth - bar的长度， sliderWidth - slider的长度。<br>barCssName: bar的样式名称，便于end-user自行扩展样式。<br>completedCssName: completed的样式名称。<br>sliderCssName: slider的样式名称。<br>sliderHover: slider聚焦时的样式名称。<br>onChanging: slider被拖拽时触发的事件。<br>onChanged: slider拖拽结束时触发的事件。</p><p>此时我们需要将renderTo强制转换成jQuery对象(兼容使用selector的情况)：</p><pre>ps.renderTo = (typeof ps.renderTo == 'string' ?                   $(ps.renderTo) : ps.renderTo);</pre><p>然后将html tree输出到render:</p><pre>/* ----------> html tree:    ---->sliderbar      ----> completed bar     ----> slider                    <-----------*/  var sliderbar = $('')                      .attr('class', ps.barCssName)                          .css('width', ps.size.barWidth)                              .appendTo(ps.renderTo);   var completedbar = sliderbar.find('div:eq(0)')                          .attr('class', ps.completedCssName);   var slider = sliderbar.find('div:eq(1)')                  .attr('class', ps.sliderCssName)                      .css('width', ps.size.sliderWidth);</pre><p>这样我们就在UI上直接呈现了Html并且用定制的css进行渲染，分别用sliderbar, completedbar, slider对我们需要的三个对象进行缓存。</p><p>ok, 在呈现了UI后我们就需要提供方法来实现slider的拖拽，在这之前我们还需要实现一个方法，就是completedbar的实时更新，即在拖动slider的时候让completedbar始终填充左侧区域：</p><pre>var bw = sliderbar.width(), sw = slider.width();  //make sure that the slider was displayed in the bar(make a limited)  ps.limited = { min: 0, max: bw - sw };   if (typeof window.$sliderProcess == 'undefined') {      window.$sliderProcess = new Function('obj1', 'obj2', 'left',                                       'obj1.css(\'left\',left);obj2.css(\'width\',left);');  }  $sliderProcess(slider, completedbar, eval('ps.limited.' + ps.initPosition));</pre><p>bw,sw用来存储sliderbar和slider的长度，此处没有直接使用ps.size里的值是为了防止样式里的border-width对width造成破坏。</p><p>定义一个私用成员limited来存储slider[left]的***值和最小值，并在后面直接使用eval('ps.limited.' + ps.initPosition)来获取，从而避免switch操作。</p><p>同时还需定义一个全局Function用来定位completedbar的填充长度以及slider左侧距离，我给其命名为$sliderProcess。</p><p>那么我们接下来剩下的工作就是slider的拖拽功能了，那么在这里我会用到之前发布的一款jQuery拖拽插件，并做适量的订制：</p><pre>//drag and drop  var slide = {      drag: function(e) {          var d = e.data;          var l = Math.min(Math.max(e.pageX - d.pageX + d.left, ps.limited.min), ps.limited.max);           $sliderProcess(slider, completedbar, l);          //push two parameters: 1st:percentage, 2nd: event          ps.onChanging(l / ps.limited.max, e);      },      drop: function(e) {          slider.removeClass(ps.sliderHover);          //push two parameters: 1st:percentage, 2nd: event          ps.onChanged(parseInt(slider.css('left')) / ps.limited.max, e);           $().unbind('mousemove', slide.drag).unbind('mouseup', slide.drop);      }  };   if (ps.enable) {      //bind events      slider.bind('mousedown', function(e) {          var d = {              left: parseInt(slider.css('left')),              pageX: e.pageX          };          $(this).addClass(ps.sliderHover);          $().bind('mousemove', d, slide.drag).bind('mouseup', d, slide.drop);      });  }</pre><p>这样当jSlider enable属性为true时，在end-user按下鼠标时绑定mousemove事件，在鼠标弹起时移除，我们只需要同步更新slider的left 属性和completedbar的width即可，同时在drag中绑定onChanging方法，在drop中绑定onChanged方法，向这两个方法推送的参数相同，1>百分比，即value值，介于0~1，2>event。</p><p>那么至此我们的jSlider插件就基本成型，向用户提供了一个可拖拽的slider。</p><p>【扩展】<br>有的时候用户却不是那么容易满足，于是有人高呼："我要自己设置value，为什么不提供这个功能？"。</p><p>那么这时我们就需要为用户公开一个方法，用于设置jSlider的value，首先考虑的是作为方法需要一个作用对象(jSlider)，那么此时我又不想将作用对象作为参数传入，那么我们还是将这个方法作为插件来开发，我们将方法命名为setSliderValue，开放2个参数，v(value值)和 callback(设置完成后的回调函数)。</p><p>即：$.fn.setSliderValue(v,callback);</p><p>ok，那么剩下的就是作用对象了，由之前的设计可知，在slider拖动时主要作用于2个对象，slider和completedbar，那么我们在jSlider插件末尾加上一段代码来返回slider对象：</p><pre>slider.data = { bar: sliderbar, completed: completedbar };  return slider;</pre><p>这样我们在初始化jSlider的时候就可以直接用一个变量来获取jSlider对象，然后调用setSliderValue方法了，伪码：</p><pre>var slider = $.fn.jSlider({});  slider.setSliderValue(v,function(){});</pre><p>setSliderValue代码：</p><pre>try {      //validate      if (typeof v == 'undefined' || v < 0 || v > 1) {          throw new Error('\'v\' must be a Float variable between 0 and 1.');      }       var s = this;       //validate       if (typeof s == 'undefined' ||          typeof s.data == 'undefined' ||              typeof s.data.bar == 'undefined') {          throw new Error('You bound the method to an object that is not a slider!');      }       $sliderProcess(s, s.data.completed, v * s.data.bar.width());       if (typeof callback != 'undefined') { callback(v); }  }  catch (e) {      alert(e.message);  }</pre><p>这里同样调用了全局Function $sliderProcess在设置slider的value值时进行completedbar[width]和slider[left]的更新。由于此处进行了异常处理，所以如果end-user在确保setSliderValue被作用于jSlider对象的时候可以删除此异常处理代码。</p><p>【皮肤】<br>根据jSlider的API我们可以更加方便的为其设定皮肤，为了让jSlider更加专业，我们需要2张图片：<br><br>用来作为completedbar背景的'bar'和用来作为slider背景的'slider'，ok，我们更新下样式：</p><pre> /*----blue skin----*/  .bluebar  {      margin-top: 10px;      height: 4px;      background:#F7F7F7;      border:solid 1px #3e3e3e;      position: relative;      }  .bluebar .jquery-completed  {      height: 4px;      background:url(../images/slider/blue/bar.gif) left center no-repeat;      top: 0;      left:0;      position: absolute;      }  .bluebar .jquery-jslider  {      height: 17px;      background:url(../images/slider/blue/slider.gif) center 0 no-repeat;      top: -4px;      display: block;      cursor: pointer;      position: absolute;      }  .bluebar .jquery-jslider-hover  {      background-position:center -17px;      }</pre><p>由于在设置样式时我仍然让子节点样式使用了API的默认值，因此在创建jSlider时我们只需要设置barCssName就行了：</p><pre>var blue = $.fn.jSlider({      renderTo: '#slidercontainer',      size: { barWidth: 500, sliderWidth: 10 },      barCssName: 'bluebar',      onChanging: function(percentage, e) {          // code goes here      }  });</pre><p>呈现出来的UI:<br><br>我们这样来设置其值：</p><pre>//set percentage with a callback function  blue.setSliderValue(0.65, function(percentage) {      // code goes here  });</pre><p>【通用性】<br>当然，我们不仅可以将jSlider作为slider使用，有时候它也是一个progressbar:<br></p><p>(代码我就不贴了，直接在demo里查看 ;-) )</p><p class="introduction">上述就是小编为大家分享的如何进行JQuery插件的开发了，如果刚好有类似的疑惑，不妨参照上述分析进行理解。如果想知道更多相关知识，欢迎关注行业资讯频道。</p>

        </div>


        <div class="diggit"><a href="#"> 很赞哦！ </a></div>
        <div class="clear"></div>

        <div class="keywords">


        <a href="/s-插件">插件</a>
            <a href="/s-开发">开发</a>
            <a href="/s-样式">样式</a>
            <a href="/s-对象">对象</a>
            <a href="/s-方法">方法</a>
            <a href="/s-代码">代码</a>
            <a href="/s-选择">选择</a>
            <a href="/s-作用">作用</a>
            <a href="/s-效果">效果</a>
            <a href="/s-方式">方式</a>
            <a href="/s-时候">时候</a>
            <a href="/s-更新">更新</a>
            <a href="/s-设计">设计</a>
            <a href="/s-参数">参数</a>
            <a href="/s-同学">同学</a>
            <a href="/s-图片">图片</a>
            <a href="/s-就是">就是</a>
            <a href="/s-用户">用户</a>
            <a href="/s-长度">长度</a>
            <a href="/s-事件">事件</a>
    
<a target="_blank" href="https://www.qianjiagd.com/tag-2377745.html">数据库的安全要保护哪些东西</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2375887.html">数据库安全各自的含义是什么</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377880.html">生产安全数据库录入</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377879.html">数据库的安全性及管理</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377878.html">数据库安全策略包含哪些</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377877.html">海淀数据库安全审计系统</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377876.html">建立农村房屋安全信息数据库</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377875.html">易用的数据库客户端支持安全管理</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377874.html">连接数据库失败ssl安全错误</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377873.html">数据库的锁怎样保障安全</a>

<a target="_blank" href="https://www.qianjiagd.com/tag-1939054.html">山西智慧校园管理平台软件开发</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1617649.html">违反网络安全法好严重</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2276145.html">武汉软件开发一般在哪个区</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1637934.html">凉山州公安网络安全宣传</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1432055.html">网络安全 你我同行手抄报</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1641797.html">学习网络安全宣传内容</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1931568.html">海淀区网络营销软件开发服务电话</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1390866.html">网络安全 acl</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2368556.html">南昌大数据库安全</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1232627.html">上海汇杰网络技术有限公司</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-362409.html">苏州服务器托管在哪里办理</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1514332.html">民间网络安全保卫</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-295222.html">服务器cpu多大内存够用</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-556031.html">ldap服务器日志路径</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1175342.html">支付宝网络技术总部在哪里</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-73983.html">打开服务器管理器的命令</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-1698441.html">公安技术专业网络安全与执法</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2304502.html">软件开发测试验收流程</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-207171.html">hp服务器 800电话</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-704404.html">本地数据库交互搜索</a>
<a target="_blank" href="https://www.qianjiagd.com/s-网络安全备案编号">网络安全备案编号</a>
<a target="_blank" href="https://www.qianjiagd.com/s-数据库 top使用方法">数据库 top使用方法</a>
<a target="_blank" href="https://www.qianjiagd.com/s-网络安全法危害">网络安全法危害</a>
<a target="_blank" href="https://www.qianjiagd.com/s-公司的数据库面试题">公司的数据库面试题</a>
<a target="_blank" href="https://www.qianjiagd.com/s-罗布乐思怎样创建服务器">罗布乐思怎样创建服务器</a>
<a target="_blank" href="https://www.qianjiagd.com/s-湖北安卓软件开发服务费">湖北安卓软件开发服务费</a>
<a target="_blank" href="https://www.qianjiagd.com/s-网络安全等宝2.0">网络安全等宝2.0</a>
<a target="_blank" href="https://www.qianjiagd.com/s-联想服务器装优麒麟系统教程">联想服务器装优麒麟系统教程</a>
<a target="_blank" href="https://www.qianjiagd.com/s-广工数据库实验安全性">广工数据库实验安全性</a>
<a target="_blank" href="https://www.qianjiagd.com/s-深圳嵌入式软件开发最新版">深圳嵌入式软件开发最新版</a>
        </div>
        


        <div class="share"><img src="https://www.qianjiagd.com/static/zsymb/images/wxgzh.jpg">
          <div class="share-text">
            <p>扫描关注千家信息网微信公众号，第一时间获取内容更新动态</p>
            <p>转载请说明来源于"千家信息网"</p>
            <p>本文地址：<a href="https://www.qianjiagd.com/a45756" target="_blank">https://www.qianjiagd.com/a45756</a></p>
          </div>
        </div>
        <div class="clear"></div>
        <div class="info-pre-next">
          <ul>
            <li><a href="https://www.qianjiagd.com/a45742"><i><em>上一篇</em><img src="https://www.qianjiagd.com/uploadfile/thumb/f0/ea6fb709.jpg"></i>
              <h2>Java中阻塞队列的示例分析</h2>
              <p>这篇文章给大家分享的是有关Java中阻塞队列的示例分析的内容。小编觉得挺实用的，因此分享给大家做个参考，一起跟随小编过来看看吧。1. 什么是阻塞队列阻塞队列是一种特殊的队列，和数据结构中普通的队列一样</p>
              </a></li>
            <li><a href="https://www.qianjiagd.com/a45758"><i><em>下一篇</em><img src="https://www.qianjiagd.com/static/assets/images/nopic.gif"></i>
              <h2>如何分析并实践JSON WEB TOKEN</h2>
              <p>这篇文章将为大家详细讲解有关如何分析并实践JSON WEB TOKEN，文章内容质量较高，因此小编分享给大家做个参考，希望大家阅读完这篇文章后对相关知识有一定的了解。1. JSON WEB TOKEN</p>
              </a></li>
          </ul>
        </div>
      </div>
    </div>


    <div class="clear blank"></div>


    <div class="otherlink whitebg">
      <div class="news-title">
        <h2>相关文章</h2>
      </div>
      <ul>
        <li><a href="https://www.qianjiagd.com/a177928" title="PHP中session会话操作技巧有哪些">PHP中session会话操作技巧有哪些</a></li>
        <li><a href="https://www.qianjiagd.com/a146158" title="PHP类相关知识点有哪些">PHP类相关知识点有哪些</a></li>
        <li><a href="https://www.qianjiagd.com/a123341" title="VS2008无法直接查看STL值怎么办">VS2008无法直接查看STL值怎么办</a></li>
        <li><a href="https://www.qianjiagd.com/a245815" title="php版微信公众平台之微信网页登陆授权的示例分析">php版微信公众平台之微信网页登陆授权的示例分析</a></li>
        <li><a href="https://www.qianjiagd.com/a201934" title="中高级PHP程序员应该掌握什么技术">中高级PHP程序员应该掌握什么技术</a></li>
        <li><a href="https://www.qianjiagd.com/a63118" title="CI框架出现mysql数据库连接资源无法释放怎么办">CI框架出现mysql数据库连接资源无法释放怎么办</a></li>
        <li><a href="https://www.qianjiagd.com/a37602" title="ajax跨域访问报错501怎么办">ajax跨域访问报错501怎么办</a></li>
        <li><a href="https://www.qianjiagd.com/a106909" title="什么是RPC框架">什么是RPC框架</a></li>
        <li><a href="https://www.qianjiagd.com/a157266" title=".net mvc超过了最大请求长度怎么办">.net mvc超过了最大请求长度怎么办</a></li>
        <li><a href="https://www.qianjiagd.com/a213044" title="php分页原理的示例分析">php分页原理的示例分析</a></li>
        <!-- <li><a target="_blank" href="/">制作是这么收费的？</a></li> -->
      </ul>
    </div>





  </div> <!-- . end of left-box -->


<!-- right aside start-->


  <aside class="side-section right-box">
    <div class="side-tab">
      <ul id="sidetab">
        <li class="sidetab-current">站长推荐</li>
        <li>点击排行</li>
      </ul>
      <div id="sidetab-content">
        <section>
          <div class="tuijian">



      <section class="topnews imgscale"><a href="https://www.qianjiagd.com/a622964" title="recovery是什么意思?电脑开机重启显示recovery蓝屏怎么办"><img src="https://www.qianjiagd.com/uploadfile/thumb/a87ff679a2f3e71d9181a67b7542122c/278x185_auto.jpg" alt="recovery是什么意思?电脑开机重启显示recovery蓝屏怎么办"><span>recovery是什么意思?电脑开机重启显示recovery蓝屏怎么办</span></a></section>
      <ul>
        <li><a href="https://www.qianjiagd.com/a67182" title="怎么在Linux中配置SSH和Xshell远程连接服务器"><i><img src="https://www.qianjiagd.com/uploadfile/thumb/9a/65e9dcdf.jpg" alt="怎么在Linux中配置SSH和Xshell远程连接服务器"></i>
          <p>怎么在Linux中配置SSH和Xshell远程连接服务器</p>
          </a></li>
        <li><a href="https://www.qianjiagd.com/a123341" title="VS2008无法直接查看STL值怎么办"><i><img src="https://www.qianjiagd.com/uploadfile/thumb/52/bf79ba42.jpg" alt="VS2008无法直接查看STL值怎么办"></i>
          <p>VS2008无法直接查看STL值怎么办</p>
          </a></li>
        <li><a href="https://www.qianjiagd.com/a106909" title="什么是RPC框架"><i><img src="https://www.qianjiagd.com/uploadfile/thumb/10/d0f5142a.jpg" alt="什么是RPC框架"></i>
          <p>什么是RPC框架</p>
          </a></li>
        <li><a href="https://www.qianjiagd.com/a157266" title=".net mvc超过了最大请求长度怎么办"><i><img src="https://www.qianjiagd.com/uploadfile/thumb/36/6d16d7e5.jpg" alt=".net mvc超过了最大请求长度怎么办"></i>
          <p>.net mvc超过了最大请求长度怎么办</p>
          </a></li>
      </ul>
      <section class="topnews imgscale"><a href="https://www.qianjiagd.com/a244736" title="java怎么实现try/catch异常块"><img src="https://www.qianjiagd.com/uploadfile/thumb/15/9878a9c6.jpg" alt="java怎么实现try/catch异常块"><span>java怎么实现try/catch异常块</span></a></section>
      <ul>
        <li><a href="https://www.qianjiagd.com/a199222" title="PHP中如何处理上传文件"><i><img src="https://www.qianjiagd.com/uploadfile/thumb/ee/203d504b.jpg" alt="PHP中如何处理上传文件"></i>
          <p>PHP中如何处理上传文件</p>
          </a></li>
        <li><a href="https://www.qianjiagd.com/a184615" title="php中require_once报错的解决方法"><i><img src="https://www.qianjiagd.com/uploadfile/thumb/ef/e0177085.jpg" alt="php中require_once报错的解决方法"></i>
          <p>php中require_once报错的解决方法</p>
          </a></li>
        <li><a href="https://www.qianjiagd.com/a192541" title="PHP如何编写学校网站上新生注册登陆程序"><i><img src="https://www.qianjiagd.com/uploadfile/thumb/a1/0898126a.jpg" alt="PHP如何编写学校网站上新生注册登陆程序"></i>
          <p>PHP如何编写学校网站上新生注册登陆程序</p>
          </a></li>
        <li><a href="https://www.qianjiagd.com/a210747" title="php中微信公众号开发模式的示例分析"><i><img src="https://www.qianjiagd.com/uploadfile/thumb/af/9e9aba9a.jpg" alt="php中微信公众号开发模式的示例分析"></i>
          <p>php中微信公众号开发模式的示例分析</p>
          </a></li>
      </ul>

          </div>
        </section>
        <section>
          <div class="paihang">


      <section class="topnews imgscale"><a href="https://www.qianjiagd.com/a21343" title="在vmware esxi6.5中将硬盘驱动类型由HDD变为SSD类型"><img src="https://www.qianjiagd.com/uploadfile/thumb/ab/08b16e75.jpg" alt="在vmware esxi6.5中将硬盘驱动类型由HDD变为SSD类型"><span>在vmware esxi6.5中将硬盘驱动类型由HDD变为SSD类型</span></a></section>
     
      <ul>
        <li><i></i><a href="https://www.qianjiagd.com/a175843" title="Vue中的匿名插槽与具名插槽是什么">Vue中的匿名插槽与具名插槽是什么</a></li>
        <li><i></i><a href="https://www.qianjiagd.com/a114973" title="vue3与vue2的区别以及vue3的API用法介绍">vue3与vue2的区别以及vue3的API用法介绍</a></li>
        <li><i></i><a href="https://www.qianjiagd.com/a27254" title="录制的横屏视频怎么变成全屏竖屏（录制的横屏怎么变竖屏）">录制的横屏视频怎么变成全屏竖屏（录制的横屏怎么变竖屏）</a></li>
        <li><i></i><a href="https://www.qianjiagd.com/a69563" title="qq群作业里为什么图片上传不了（qq群作业照片传不上去）">qq群作业里为什么图片上传不了（qq群作业照片传不上去）</a></li>
        <li><i></i><a href="https://www.qianjiagd.com/a71754" title="vscoder如何关闭错误提示">vscoder如何关闭错误提示</a></li>
        <li><i></i><a href="https://www.qianjiagd.com/a36693" title="百度网盘PDF怎么转换成Word格式 PDF转Word操作教程">百度网盘PDF怎么转换成Word格式 PDF转Word操作教程</a></li>
        <li><i></i><a href="https://www.qianjiagd.com/a15469" title="老年机号码拉黑怎么解除（老年机号码拉黑怎么解除）">老年机号码拉黑怎么解除（老年机号码拉黑怎么解除）</a></li>
        <li><i></i><a href="https://www.qianjiagd.com/a85246" title="京东以旧换新评估价和实际一样吗（京东以旧换新估价和成交价一样吗）">京东以旧换新评估价和实际一样吗（京东以旧换新估价和成交价一样吗）</a></li>
      </ul>
      <section class="topnews imgscale"><a href="https://www.qianjiagd.com/a13935" title="拼多多注销后可以重开新用户吗（拼多多注销后重开算新用户吗）"><img src="https://www.qianjiagd.com/uploadfile/thumb/0a/8e8c068e.jpg" alt="拼多多注销后可以重开新用户吗（拼多多注销后重开算新用户吗）"><span>拼多多注销后可以重开新用户吗（拼多多注销后重开算新用户吗）</span></a></section>
  

          </div>
        </section>
      </div>
    </div>



    <div class="whitebg cloud">
      <h2 class="side-title">标签云</h2>
      <ul>


<a target="_blank" href="https://www.qianjiagd.com/tag-2377745.html">数据库的安全要保护哪些东西</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2375887.html">数据库安全各自的含义是什么</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377880.html">生产安全数据库录入</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377879.html">数据库的安全性及管理</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377878.html">数据库安全策略包含哪些</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377877.html">海淀数据库安全审计系统</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377876.html">建立农村房屋安全信息数据库</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377875.html">易用的数据库客户端支持安全管理</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377874.html">连接数据库失败ssl安全错误</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377873.html">数据库的锁怎样保障安全</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377872.html">数据库安全章节测试</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377871.html">华大基因数据库安全性</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377870.html">数据库es安全性测试工具</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377869.html">数据库与云安全</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377868.html">微生物安全数据库</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377867.html">数据库个人信息安全吗</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377866.html">安全数据库降级</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377865.html">黑龙江数据库安全防护系统</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377864.html">数据库安全性实验例题</a>
<a target="_blank" href="https://www.qianjiagd.com/tag-2377863.html">在国家公共安全数据库有记录</a>


      </ul>
    </div>


    <div class="clear blank"></div>

    <div class="whitebg suiji">
      <h2 class="side-title">猜你喜欢</h2>
      <ul>
        <li><a href="https://www.qianjiagd.com/a29879" title="微信登录加载联系人失败怎么弄（微信加载联系人失败 点击重试）">微信登录加载联系人失败怎么弄（微信加载联系人失败 点击重试）</a></li>
        <li><a href="https://www.qianjiagd.com/a63090" title="华为手机按键震动在哪设置关掉 按键振动怎么取消方法">华为手机按键震动在哪设置关掉 按键振动怎么取消方法</a></li>
        <li><a href="https://www.qianjiagd.com/a73496" title="陌陌无限注册教程（怎么注册陌陌新号）">陌陌无限注册教程（怎么注册陌陌新号）</a></li>
        <li><a href="https://www.qianjiagd.com/a206293" title="win10开机蓝屏终止代码SYSTEM_SERVICE_EXCEPTION的解决方法">win10开机蓝屏终止代码SYSTEM_SERVICE_EXCEPTION的解决方法</a></li>
        <li><a href="https://www.qianjiagd.com/a71928" title="微信看不到朋友圈不显示一条横线（微信看不到朋友圈只有一条横线）">微信看不到朋友圈不显示一条横线（微信看不到朋友圈只有一条横线）</a></li>
        <li><a href="https://www.qianjiagd.com/a123341" title="VS2008无法直接查看STL值怎么办">VS2008无法直接查看STL值怎么办</a></li>
        <li><a href="https://www.qianjiagd.com/a173126" title="快影怎么把视频弄成横屏播放 制作方法分享">快影怎么把视频弄成横屏播放 制作方法分享</a></li>
        <li><a href="https://www.qianjiagd.com/a22324" title="拼多多的多多支付怎么解绑银行卡（拼多多的多多支付怎么解绑银行卡）">拼多多的多多支付怎么解绑银行卡（拼多多的多多支付怎么解绑银行卡）</a></li>
        <li><a href="https://www.qianjiagd.com/a99782" title="怎么将苹果手机中录音发给好友 iPhone传语音文件方法教程">怎么将苹果手机中录音发给好友 iPhone传语音文件方法教程</a></li>
        <li><a href="https://www.qianjiagd.com/a213464" title="iis7.5中如何让html与shtml一样支持include功能">iis7.5中如何让html与shtml一样支持include功能</a></li>
 
      </ul>
    </div>
  </aside>



<!-- right aside  end-->

</article>



<div class="clear blank"></div>


<!--footer start-->
<footer>
  <div class="footer box">
    <div class="wxbox">
      <ul>
        <li><img src="https://www.qianjiagd.com/static/zsymb/images/wxgzh.jpg"><span>微信公众号</span></li>
        <li><img src="https://www.qianjiagd.com/static/zsymb/images/wx.png"><span>我的微信</span></li>
      </ul>
    </div>
    <div class="endnav">
      <p><b>站点声明：</b></p>
      <p>所有文章未经授权禁止转载、摘编、复制或建立镜像，如有违反，追究法律责任。</p>
      <p>Copyright © 2009-2024  <a href="https://www.qianjiagd.com/" target="_blank">千家信息网</a> All Rights Reserved.
        <a href="/sitemap.xml">网站地图</a>
        <a href="/about/">关于我们</a>
        <a href="/contact-us/">联系我们</a>

      </p>
    </div>
  </div>
</footer>

<a href="#" title="返回顶部" class="icon-top"></a>

<!--footer end-->



<div style="display:none">

<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?aec778eae8071ef8921721735a4a9509";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>


<script>
    (function(){
        var bp = document.createElement('script');
        var curProtocol = window.location.protocol.split(':')[0];
        if (curProtocol === 'https') {
            bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
        }
        else {
            bp.src = 'http://push.zhanzhang.baidu.com/push.js';
        }
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(bp, s);
    })();
</script>

</div>

<div style="display:none">
<span class="dr_show_hits_45756">0</span><script type="text/javascript"> $.ajax({ type: "GET", url:"/index.php?s=api&c=module&siteid=1&app=article&m=hits&id=45756", dataType: "jsonp", success: function(data){ if (data.code) { $(".dr_show_hits_45756").html(data.msg); } else { dr_tips(0, data.msg); } } }); </script></div>

<!--本页面URL https://www.qianjiagd.com/a45756 -->
<!--本页面于2024-12-13 02:47:31更新-->
</body>
</html>