复制粘贴插件——clipboard.js的使用 javascript

clipboard.js
将文本复制到剪贴板应该不难。配置它不需要几十个步骤，也不需要加载数百KB的js文件。但最重要的是，它不应该依赖 Flash或任何臃肿的框架。这就是 clipboard.js存在的原因。
安装从npm 安装
npm install clipboard --save
或者，如果您不喜欢包管理，只需下载一个ZIP文件
设置
script 引入
三方 CDN引入
现在需要通过传递一个DOM选择器、一个HTML标签或者一组HTML标签来实例化它
new ClipboardJS('.btn'); //通过类名.btn的元素实例化
在内部，我们需要获取与选择器匹配的所有元素，并为每个元素附加事件监听器。但你猜怎么着?如果有数百个匹配项，则此操作会消耗大量内存。
因此，我们使用事件委托，它将多个事件侦听器替换为一个侦听器。
使用方法我们正在经历一个声明性的复兴，这就是为什么我们决定利用HTML5的数据属性来获得更好的可用性
复制
【复制粘贴插件——clipboard.js的使用】相当普遍的使用场景是从其他元素复制文本。在触发元素上添加 data-clipboard-target 属性，该属性值用来匹配另一个元素选择器。
无敌大帅哥
剪切
另外，也可以定义 data-clipboard-action 属性为 copy/cut 来，明确操作是 复制 / 剪切
如果忽略了这个属性，便默认 复制
Mussum ipsum cacilds...
正如上例，剪切 cut 的操作只能在和
</code> 标签中起作用，在其他标签中会出现事件正常调用，但是操作是失败的，粘贴板是没有改变的。<br />
 
 通过属性复制文本<br />
 
 我们甚至不必需要其他承载文本的元素，仅通过 在触发元素中 添加 <code>data-clipboard-text</code> 属性 来完成复制<br />
 
 <blockquote><code>
<button class="btn" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">
Copy to clipboard
</button>
</code></blockquote><br />
 
 注意：<br />
 
 <ul> 
<li> <code>data-clipboard-text</code> “级别最高”，在 <code>data-clipboard-target</code> 等属性存在时，复制内容及相关参数以 <code>data-clipboard-text</code> 为准</li> 
 </ul> 
 事件<br />
 
 回调函数： <code>success / error</code><br />
 
 <table> 
<thead> 
<tr> 
<th align="center">事件名</th> 
<th>参数</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td align="center">success</td> 
<td>event.action <code>copy/cut</code> 操作</td> 
</tr> 
<tr> 
<td align="center"> </td> 
<td>event.text <code>copy/cut</code> 操作文本内容</td> 
</tr> 
<tr> 
<td align="center"> </td> 
<td>event.triger 触发操作的<code>DOM</code>元素</td> 
</tr> 
<tr> 
<td align="center">error</td> 
<td>event.action <code>copy/cut</code> 操作</td> 
</tr> 
<tr> 
<td align="center"> </td> 
<td>event.triger 触发操作的<code>DOM</code>元素</td> 
</tr> 
</tbody> 
 </table> 
 <blockquote><code>var clipboard = new ClipboardJS('.btn');
clipboard.on('success', function(e) {
console.info('Action:', e.action);

console.info('Text:', e.text);

console.info('Trigger:', e.trigger);
e.clearSelection();

});
clipboard.on('error', function(e) {
console.error('Action:', e.action);

console.error('Trigger:', e.trigger);

});

</code></blockquote><br />
 
 工具提示 
 每个应用程序有不同的设计需求，这就是为什么<code>clipboard.js</code>不包括任何CSS或内置的工具提示解决方案。<br>您在这个演示站点上看到的工具提示是使用GitHub的Primer构建的。如果你正在寻找相似的外观和感觉，你可能想看看。<br />
 
 高级用法 
 如果你不想修改你的HTML，有一个非常方便的命令式API供你使用。您所需要做的就是声明一个函数，执行您的操作，然后返回一个值。<br />
 
 例如 如果想动态的设置一个目标元素<code>target</code>，则需要返回一个节点,即 动态设置点击复制的目标元素<br />
 
 <blockquote><code>new ClipboardJS('.btn', {
target: function(trigger) {
return trigger.nextElementSibling||document.getElementById('name');

}
});

</code></blockquote><br />
 
 如果想动态设置内容文本<code>text</code>，则返回一个字符串<code>String</code><br />
 
 <blockquote><code>new ClipboardJS('.btn', {
text: function(trigger) {
return trigger.getAttribute('aria-label') || 'default text ';

}
});

</code></blockquote><br />
 
 在<code>Bootstrap Modals</code> 中或与任何其他更改焦点的库一起使用时，将希望将焦点元素设置为 <code>container</code> 值。<br />
 
 <blockquote><code>new ClipboardJS('.btn', {
container: document.getElementById('modal')
});

</code></blockquote><br />
 
 并且，如果在单页应用中使用时，要更精确地管理DOM的生命周期，可以使用以下方法清除创建的事件对象<br />
 
 <blockquote><code>var clipboard = new ClipboardJS('.btn');

clipboard.destroy();

</code></blockquote><br />
 
 浏览器支持 
 这个库同时依赖于<code>Selection</code>和<code>execCommand</code> api。所有浏览器都支持第一个，而以下浏览器支持第二个。<br />
 
 <ul> 
<li>Chrome 42 +</li> 
<li>Edge12 +</li> 
<li>Firefox 41 +</li> 
<li>IE 9 +</li> 
<li>Opera 29 +</li> 
<li>Safari 10 +</li> 
 </ul> 
 好消息是，如果需要支持旧的浏览器，<code>clipboard.js</code>可以优雅地降级。你所要做的就是显示一个工具提示“复制!”在调用成功事件时，因为文本已经被选中，所以在调用错误事件时，请按<code>Ctrl+C</code>进行复制。<br>你也可以通过运行<code>ClipboardJS.isSupported()</code>来检查是否支持<code>clipboard.js</code>，这样你就可以从UI中隐藏复制/剪切按钮。<br />
 
 彩蛋 
 Chrome 和 Firefox 浏览器扩展：在 GitHub, MDN, Gist, StackOverflow, StackExchange, npm, and even Mediu 的代码块中 添加一个 "copy to clipboard" 的按钮<br />
</p>
<div class="dede_pages"><ul></ul></div>
		  	<div class="pcd_ad">
<center><div class="_ahwullr0ac"></div>
    <script type="text/javascript">
        (window.slotbydup = window.slotbydup || []).push({
            id: "u6834461",
            container: "_ahwullr0ac",
            async: true
        });
    </script>
    <script type="text/javascript" src="//cpro.baidustatic.com/cpro/ui/cm.js" async="async" defer="defer" >
    </script></center>
</div>
<div class="mbd_ad">
<div style=margin-top:10px;margin-bottom:10px;>
<div class="_i7aftr79jl"></div>
    <script type="text/javascript">
        (window.slotbydup = window.slotbydup || []).push({
            id: "u5950612",
            container: "_i7aftr79jl",
            async: true
        });
    </script>
    <!-- ����������½ű�ֻ������һ�� -->
    <script type="text/javascript" src="//cpro.baidustatic.com/cpro/ui/cm.js" async="async" defer="defer" >
    </script>
</div>
</div>
<h3>推荐阅读</h3>
<ul class="post-loop post-loop-default cols-0">
           <li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/3555000.html" title="vb.net操作硬件 vbnet implements"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="vb.net操作硬件 vbnet implements" src="/images/defaultpic.gif"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/3555000.html"> <b>vb.net操作硬件 vbnet implements </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/1274827.html" title="今日淘汰鸡全国价格 今日鸡蛋价格"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="今日淘汰鸡全国价格 今日鸡蛋价格" src="/images/defaultpic.gif"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/1274827.html"> <b>今日淘汰鸡全国价格 今日鸡蛋价格 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/3036636.html" title="小宅vr眼镜好用吗 小宅魔镜头盔使用说明"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="小宅vr眼镜好用吗 小宅魔镜头盔使用说明" src="http://img.readke.com/230819/2332034K0-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/3036636.html"> <b>小宅vr眼镜好用吗 小宅魔镜头盔使用说明 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/980661.html" title="毕业季家长的感言美句 家长对老师的感言简短"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="毕业季家长的感言美句 家长对老师的感言简短" src="/images/defaultpic.gif"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/980661.html"> <b>毕业季家长的感言美句 家长对老师的感言简短 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/3134611.html" title="洛神花怎么养护 洛神花怎么养能开花"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="洛神花怎么养护 洛神花怎么养能开花" src="http://img.readke.com/230909/130420ND-0-lp.png"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/3134611.html"> <b>洛神花怎么养护 洛神花怎么养能开花 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/3628409.html" title="鸿蒙3安全流畅，鸿蒙系统安全程度"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="鸿蒙3安全流畅，鸿蒙系统安全程度" src="/images/defaultpic.gif"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/3628409.html"> <b>鸿蒙3安全流畅，鸿蒙系统安全程度 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/2821037.html" title="2022三九天时间表 三九天2021时间表图"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="2022三九天时间表 三九天2021时间表图" src="http://img.readke.com/230724/0523105541-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/2821037.html"> <b>2022三九天时间表 三九天2021时间表图 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/3563572.html" title="暗杀动作手机游戏，暗杀系列游戏大全"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="暗杀动作手机游戏，暗杀系列游戏大全" src="/images/defaultpic.gif"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/3563572.html"> <b>暗杀动作手机游戏，暗杀系列游戏大全 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/4083445.html" title="ospf路由表分析,OSPF路由表的作用"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="ospf路由表分析,OSPF路由表的作用" src="/images/defaultpic.gif"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/4083445.html"> <b>ospf路由表分析,OSPF路由表的作用 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/3132184.html" title="植发3000个毛囊面积图 植发三千个毛囊单位有多少面积"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="植发3000个毛囊面积图 植发三千个毛囊单位有多少面积" src="http://img.readke.com/230909/02195M4L-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/3132184.html"> <b>植发3000个毛囊面积图 植发三千个毛囊单位有多少面积 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/2158386.html" title="美股怎么选 美股怎么选股"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="美股怎么选 美股怎么选股" src="http://img.readke.com/230520/0H6352615-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/2158386.html"> <b>美股怎么选 美股怎么选股 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/3774262.html" title="世界word安卓,如何使用安卓用手机打印pdf?"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="世界word安卓,如何使用安卓用手机打印pdf?" src="/images/defaultpic.gif"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/3774262.html"> <b>世界word安卓,如何使用安卓用手机打印pdf? </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/2485245.html" title="关于重阳节的诗词 重阳节有哪些诗词"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="关于重阳节的诗词 重阳节有哪些诗词" src="http://img.readke.com/230610/12532524S-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/2485245.html"> <b>关于重阳节的诗词 重阳节有哪些诗词 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/2968945.html" title="红豆薏米芡实茶哪些人不能喝"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="红豆薏米芡实茶哪些人不能喝" src="/images/defaultpic.gif"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/2968945.html"> <b>红豆薏米芡实茶哪些人不能喝 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/1834007.html" title="香辣帝王蟹的做法 帝王蟹做法"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="香辣帝王蟹的做法 帝王蟹做法" src="http://img.readke.com/230428/2046256362-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/1834007.html"> <b>香辣帝王蟹的做法 帝王蟹做法 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/110330Z332021.html" title="万像素|荣耀X30 MAX，不只有大！"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="万像素|荣耀X30 MAX，不只有大！" src="https://p0.ssl.img.360kuai.com/t0190ca370452578807.jpg?size=640x427"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/110330Z332021.html"> <b>万像素|荣耀X30 MAX，不只有大！ </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/3696583.html" title="想减肥的人少吃鸡翅 这些高热量食物减肥期间不要碰"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="想减肥的人少吃鸡翅 这些高热量食物减肥期间不要碰" src="http://img.readke.com/231213/1A41J462-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/3696583.html"> <b>想减肥的人少吃鸡翅 这些高热量食物减肥期间不要碰 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/3077229.html" title="郭德纲的麒麟剧社有发展前途吗？能不能最后收编主流京剧界？"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="郭德纲的麒麟剧社有发展前途吗？能不能最后收编主流京剧界？" src="http://img.readke.com/230827/15020061N-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/3077229.html"> <b>郭德纲的麒麟剧社有发展前途吗？能不能最后收编主流京剧界？ </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/2573793.html" title="传统的汽配公司在干什么 汽配公司属于什么行业"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="传统的汽配公司在干什么 汽配公司属于什么行业" src="http://img.readke.com/230624/0H4146051-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/2573793.html"> <b>传统的汽配公司在干什么 汽配公司属于什么行业 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>
<li class="item">
              <div class="item-img"> <a class="item-img-inner" href="/c/1181511.html" title="桌游黑暗之魂好玩吗 黑暗之魂游戏介绍和攻略"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="桌游黑暗之魂好玩吗 黑暗之魂游戏介绍和攻略" src="http://img.readke.com/230228/0G25962F-0-lp.jpg"> </a> </div>
              <div class="item-content">
                <h4 class="item-title"> <a href="/c/1181511.html"> <b>桌游黑暗之魂好玩吗 黑暗之魂游戏介绍和攻略 </b></a></h4>
                <div class="item-meta">
                  <div class="item-meta-right"> </div>
                </div>
              </div>
            </li>

          </ul>
<p><br /><ul class="post-loop post-loop-list cols-4"><li><a href="/c/021T5L312022.html" title="Docker应用:容器间通信与Mariadb数据库主从复制" target="_blank">Docker应用:容器间通信与Mariadb数据库主从复制 
</a></li> <li><a href="/c/021T564092022.html" title="jQuery插件" target="_blank">jQuery插件 
</a></li> <li><a href="/c/021T562522022.html" title="VueX--VUE核心插件" target="_blank">VueX--VUE核心插件 
</a></li> <li><a href="/c/021J552L2022.html" title="用npm发布一个包的教程并编写一个vue的插件发布" target="_blank">用npm发布一个包的教程并编写一个vue的插件发布 
</a></li> <li><a href="/c/0216454C62022.html" title="复制阳光" target="_blank">复制阳光 
</a></li> <li><a href="/c/02164540052022.html" title="插件化无法获取或找到.so文件" target="_blank">插件化无法获取或找到.so文件 
</a></li> <li><a href="/c/0216453UR022.html" title="maven使用tomcat7插件编译jsp出错" target="_blank">maven使用tomcat7插件编译jsp出错 
</a></li> <li><a href="/c/02164535642022.html" title="《可复制的领导力》读后感之一----学会倾听，提高效率" target="_blank">《可复制的领导力》读后感之一----学会倾听，提高效率 
</a></li> <li><a href="/c/02164531P2022.html" title="超好用的PubMed文献查找管理插件—Scholarscope" target="_blank">超好用的PubMed文献查找管理插件—Scholarscope 
</a></li> <li><a href="/c/02154522V2022.html" title="python|8. 文件系统——文件的删除、移动、复制过程以及链接文件" target="_blank">python|8. 文件系统——文件的删除、移动、复制过程以及链接文件 
</a></li> </ul></p>
            <div class=entry-copyright>
              <p></p>
            </div>
          </div>
          <div class="entry-footer">
    <div class="prev-next sb br mb clearfix">
      <p class="post-prev fl ellipsis">上一篇：<a href='/c/10102Q3412021.html'>测试开发专题-目录</a> </p>
      <p class="post-next fr ellipsis">下一篇：<a href='/c/10102Q3432021.html'>深挖Goodreads书籍数据 - 20k爬取量</a> </p>
    </div>

          </div>
        </div>
      </article>
    </main>
    <aside class="sidebar">
      <div class="widget widget_post_thumb">
        <h3 class="widget-title"><span>更多...</span></h3>
        <ul>
          <li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/091119544H021.html" title="春芽"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="春芽" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/091119544H021.html" title="春芽">春芽</a></p>
            </div>
          </li>
<li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/0S1114M12021.html" title="自动化测试"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="自动化测试" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/0S1114M12021.html" title="自动化测试">自动化测试</a></p>
            </div>
          </li>
<li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/01013c3312022.html" title="读书沙龙好书推荐"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="读书沙龙好书推荐" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/01013c3312022.html" title="读书沙龙好书推荐">读书沙龙好书推荐</a></p>
            </div>
          </li>
<li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/121SER92021.html" title="雷微静（回得了过去，回不了当初）"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="雷微静（回得了过去，回不了当初）" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/121SER92021.html" title="雷微静（回得了过去，回不了当初）">雷微静（回得了过去，回不了当初）</a></p>
            </div>
          </li>
<li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/10022644542021.html" title="我在深夜里笑"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="我在深夜里笑" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/10022644542021.html" title="我在深夜里笑">我在深夜里笑</a></p>
            </div>
          </li>
<li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/0Z61613252021.html" title="海的约会第七天、第八天"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="海的约会第七天、第八天" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/0Z61613252021.html" title="海的约会第七天、第八天">海的约会第七天、第八天</a></p>
            </div>
          </li>
<li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/09152139242021.html" title="一分钟英语趣问答|一分钟英语趣问答 14"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="一分钟英语趣问答|一分钟英语趣问答 14" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/09152139242021.html" title="一分钟英语趣问答|一分钟英语趣问答 14">一分钟英语趣问答|一分钟英语趣问答 14</a></p>
            </div>
          </li>
<li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/010T1KU2022.html" title="Activity的四种启动模式及其分析"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="Activity的四种启动模式及其分析" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/010T1KU2022.html" title="Activity的四种启动模式及其分析">Activity的四种启动模式及其分析</a></p>
            </div>
          </li>
<li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/09222329E2021.html" title="记一次线上内存泄漏问题的排查过程"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="记一次线上内存泄漏问题的排查过程" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/09222329E2021.html" title="记一次线上内存泄漏问题的排查过程">记一次线上内存泄漏问题的排查过程</a></p>
            </div>
          </li>
<li class="item">
            <div class="item-img"> <a class="item-img-inner" href="/c/0925244V32021.html" title="罗大伦《道德经》225"> <img width="480" height="300" class="attachment-default size-default wp-post-image j-lazy" alt="罗大伦《道德经》225" src="/images/defaultpic.gif"> </a></div>
            <div class="item-content">
              <p class="item-title"><a href="/c/0925244V32021.html" title="罗大伦《道德经》225">罗大伦《道德经》225</a></p>
            </div>
          </li>

        </ul>
      </div>
	
	
    </aside>
  </div>
</div>
<footer class="footer">
  <div class="container">
    <div class="clearfix">
      <div class="footer-col footer-col-logo"> <!--<img src="/skin/images/logo-footer.png">--></div>
      <div class="footer-col footer-col-copy">
        <ul class="footer-nav hidden-xs">
          <li class="menu-item menu-item-706"><a href="/baike/">生活百科</a></li>
          
          <li class="menu-item menu-item-706"><a href="/it/">it技术</a></li>
		  
        </ul>
        <div class="copyright">
          <p>Copyright © 2017-2022 锐客网 <a href="http://beian.miit.gov.cn/" target="_blank" rel="nofollow">京ICP备11041112号-41</a> </p>
        </div>
      </div>
      <div class="footer-col footer-col-sns">
        <div class="footer-sns"> </div>
      </div>
    </div>
  </div>
</footer>
<div class="action action-style-0 action-color-0 action-pos-1" style="bottom:15%;">
  <div class="action-item gotop j-top"> <i class="web-icon wi action-item-icon"><svg aria-hidden="true">
    <use xlink:href="#wi-arrow-up-2"></use>
    </svg></i></div>
</div>
<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?79e4e485d34c6fc717489eaa10b314e3";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>
</div>
<script>var _web_js={};</script> 
<script src="/skin/js/index.js"></script>
</body>
</html>