<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[wangcuiling_123的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/wangcuiling_123</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; wangcuiling_123]]></copyright><item><title><![CDATA[页面显示多个倒计时简单案例]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87728003</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87728003</guid><author>wangcuiling_123</author><pubDate>Tue, 19 Feb 2019 19:24:48 +0800</pubDate><description><![CDATA[今天看到一篇关于页面显示多个倒计时的，发现代码存在一些错误，而且是采用了对象的方式，无法实现多个倒计时，一般这种是使用在购物商城多个商品倒计时，便自己写了以下这个简单的案例，采用构造函数，可实例化多个（已测试）：
效果图：

案例代码：
&amp;amp;lt;!DOCTYPE html&amp;amp;gt;
&amp;amp;lt;html lang=&amp;quot;en&amp;quot;&amp;amp;gt;
&amp;amp;lt;head&amp;amp;gt;
    &amp;amp;]]></description><category></category></item><item><title><![CDATA[Three.js第三节(一个案例详解)]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87635424</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87635424</guid><author>wangcuiling_123</author><pubDate>Mon, 18 Feb 2019 18:18:08 +0800</pubDate><description><![CDATA[前面两节是根据官网写的three.js的简单案例，本节介绍一个教程书的案例(注意：本节案例的纹理图片为自行下载，纹理可随意选取textures文件夹下的纹理图片)
效果图：

案例代码：
&amp;amp;amp;lt;!doctype html&amp;amp;amp;gt;
&amp;amp;amp;lt;html lang=&amp;amp;quot;en&amp;amp;quot;&amp;amp;amp;gt;
&amp;amp;amp;lt;head&amp;amp;amp;gt;
    &a]]></description><category></category></item><item><title><![CDATA[Three.js第二节draw line]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87278872</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87278872</guid><author>wangcuiling_123</author><pubDate>Thu, 14 Feb 2019 16:03:46 +0800</pubDate><description><![CDATA[效果图：

案例代码：
&amp;amp;amp;lt;!doctype html&amp;amp;amp;gt;
&amp;amp;amp;lt;html lang=&amp;amp;quot;en&amp;amp;quot;&amp;amp;amp;gt;
&amp;amp;amp;lt;head&amp;amp;amp;gt;
    &amp;amp;amp;lt;meta charset=&amp;amp;quot;UTF-8&amp;amp;quot;&amp;amp;amp;gt;
    &]]></description><category></category></item><item><title><![CDATA[Three.js第一节Hello World]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87194971</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87194971</guid><author>wangcuiling_123</author><pubDate>Wed, 13 Feb 2019 17:55:59 +0800</pubDate><description><![CDATA[学习three.js第一节案例：创建一个立方体
代码：
&amp;amp;amp;amp;lt;!DOCTYPE html&amp;amp;amp;amp;gt;
&amp;amp;amp;amp;lt;head&amp;amp;amp;amp;gt;
    &amp;amp;amp;amp;lt;meta charset=&amp;amp;amp;quot;UTF-8&amp;amp;amp;quot;&amp;amp;amp;amp;gt;
    &amp;amp;amp;amp;lt;meta n]]></description><category></category></item><item><title><![CDATA[WebGL框架three.js]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87192572</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/87192572</guid><author>wangcuiling_123</author><pubDate>Wed, 13 Feb 2019 17:20:11 +0800</pubDate><description><![CDATA[查看一个简单的案例：http://www.wjceo.com/blog/threejs/2018-02-07/3.html
从今天开始，我学习WebGL基础将占时告一段落，开始学习WebGL的流行框架three.js。经验告诉我，学习一种语言，如果入门能力差，最好从框架开始学，虽然会被掩盖很多的原理方面的东西，但是，你能直接做出来一些东西，给自己充足的信心，能让自己做下去。如果你连东西都做不出来，...]]></description><category></category></item><item><title><![CDATA[mtl材质文件格式]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86750469</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86750469</guid><author>wangcuiling_123</author><pubDate>Sat, 02 Feb 2019 16:27:46 +0800</pubDate><description><![CDATA[示例mtl材质文件：
#Blender MTL File: ‘’
#Material Count: 2
newmtl Material
Ka 0.000000 0.000000 0.000000
Kd 1.000000 0.000000 0.000000
Ks 0.000000 0.000000 0.000000
Ns 96.078431
Ni 1.000000
d 1.000000
illum ...]]></description><category></category></item><item><title><![CDATA[理解obj模型文件的格式和每行的意义]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86750408</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86750408</guid><author>wangcuiling_123</author><pubDate>Sat, 02 Feb 2019 16:21:31 +0800</pubDate><description><![CDATA[示例obj模型文件：
#Blender v2.60 (sub 0) OBJ File: ‘’
#www.blender.org
mtllib cube.mtl
o Cube
v 1.000000 -1.000000 -1.000000
v 1.000000 -1.000000 1.000000
v -1.000000 -1.000000 1.000000
v -1.000000 -1.000000...]]></description><category></category></item><item><title><![CDATA[编程中的几种命名方法]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86742793</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86742793</guid><author>wangcuiling_123</author><pubDate>Fri, 01 Feb 2019 16:53:31 +0800</pubDate><description><![CDATA[在编程中，有个好的规范是很有必要的，下面介绍下前端常用的命名方法：
一、匈利亚命名法
匈牙利命名法是一种编程时的命名规范。基本原则是：变量名=属性+类型+对象描述，其中每一对象的名称都要求有明确含义，可以取对象名字全称或名字的一部分。要基于容易记忆容易理解的原则。匈牙利命名法的特点是前缀。用前缀标明变量的类型。前缀后面的单词首字母大写，其他字母小写。让人一看到变量名就能知道这个变量的类型。好像前端...]]></description><category></category></item><item><title><![CDATA[火狐a标签download无反应--button和a标签冲突问题]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86711599</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86711599</guid><author>wangcuiling_123</author><pubDate>Thu, 31 Jan 2019 10:20:49 +0800</pubDate><description><![CDATA[情景：在做项目的时候，下载模板链接a标签放到了button标签内，在谷歌浏览器可以，可是在火狐点击就是没反应，查看了下，在火狐中根本就没有触发a标签点击事件，查了下原因如下：
在火狐中，button内嵌套a标签，button 会覆盖标签，无法触发a标签的点击事件，所有无法下载，并不是火狐不支持a标签的download问题，在w3c上明确写明火狐是支持的。
解决方法：
方法一： 将外层button去...]]></description><category></category></item><item><title><![CDATA[vue prop知识点]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86699150</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86699150</guid><author>wangcuiling_123</author><pubDate>Wed, 30 Jan 2019 09:48:39 +0800</pubDate><description><![CDATA[一、Prop的大小写
HTML 中的特性名是大小写不敏感的，所以浏览器会把所有大写字符解释为小写字符。这意味着当你使用 DOM 中的模板时，camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名) 命名：
Vue.component('blog-post', {                                          ...]]></description><category></category></item><item><title><![CDATA[Vue+Webpack搭建多页面应用案例]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86508932</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86508932</guid><author>wangcuiling_123</author><pubDate>Wed, 16 Jan 2019 15:43:49 +0800</pubDate><description><![CDATA[注解：使用vue可以搭建单页面应用（SPA, Single-page Application），也可搭建多页面应用（MPA, Multi-page Application），在搭建多页面应用前，我们先看下单页面应用和多页面应用的区别以及各自的优缺点：
一、单页面应用(SPA, Single-page Application)和多页面应用(MPA, Multi-page Application)的区...]]></description><category></category></item><item><title><![CDATA[WebGL绘制阴影]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86308805</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86308805</guid><author>wangcuiling_123</author><pubDate>Fri, 11 Jan 2019 17:24:25 +0800</pubDate><description><![CDATA[一、本节概述：
这一节我们来研究如何实现阴影。首先，实现阴影有很多方法，本节所介绍的方法采用的是阴影贴图(shadow map)，或称为深度贴图(depth map)。
二、本节知识点：
如何实现阴影
实现阴影的基本原理：太阳看不见阴影。如果在光源出放置一位观察者，其视线方向与光线一致，那么观察者也看不到阴影。他看到的每一处都在光的照射下，而那些背后的，他没有看到的物体则处在阴影中。这里，我们需要...]]></description><category></category></item><item><title><![CDATA[WebGL以渲染的三维图像作为纹理]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86302026</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/86302026</guid><author>wangcuiling_123</author><pubDate>Fri, 11 Jan 2019 15:09:53 +0800</pubDate><description><![CDATA[一、本节概述：
WebGL渲染三维图形，然后将渲染结果做为纹理贴到另一个三维物体上去。实际上，把渲染结果作为纹理使用，就是动态的生成图像，而不是向服务器请求加载外部图像。在纹理图像被贴上图形之前，我们还可以对其做一些额外的处理，比如动态模糊和景深效果。
二、本节知识点：
帧缓冲区对象和渲染缓冲区对象
在默认情况下，WebGL在颜色缓冲区中进行绘图，在开启隐藏面消除功能时，还会用到深度缓冲区。总之，...]]></description><category></category></item><item><title><![CDATA[Layui table 多个表格获取某个表格的全部数据]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85619601</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85619601</guid><author>wangcuiling_123</author><pubDate>Wed, 02 Jan 2019 15:41:11 +0800</pubDate><description><![CDATA[layui table，获取table的全部数据，只需要一行代码即可：
layui.table.cache.table     // table为id

当页面有两个或多个table实例时，获取其全部数据只需指定id即可：
 layui.table.cache.table    // id为table
 layui.table.cache.table1   // id为table1


...]]></description><category></category></item><item><title><![CDATA[WebStorm 使用中常用的快捷键（自己整理，常用的）]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85600091</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85600091</guid><author>wangcuiling_123</author><pubDate>Wed, 02 Jan 2019 10:25:05 +0800</pubDate><description><![CDATA[在使用编辑器webStorm编辑代码时，使用一些快捷键，能很好的提高我们的开发效率，以下为我整理的平时常用的快捷键，（后续会继续添加）
常用快捷键
1、Ctrl + /:  单行注释
2、Ctrl + Shift + /:  添加注释文本/块注释
3、Ctrl + F:  查找文本
4、Ctrl + R:  替换文本
5、Ctrl + D:  复制行
6、Ctrl + 鼠标单击： 跳到变量声明处
...]]></description><category></category></item><item><title><![CDATA[Echarts markPoint 标注自定义的使用]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85340257</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85340257</guid><author>wangcuiling_123</author><pubDate>Sat, 29 Dec 2018 16:02:50 +0800</pubDate><description><![CDATA[在使用Echarts图表时，我们很多时候需要标注自定义的数据(不止标注最大值，最小值)
1. 标注最大值 最小值
示例：

2、自定义标注
示例： 标注的是第二个和第六个值


参数：
value  为标注值
xAxis  标注位置X轴   可以是x轴对应的值，也可以是xAxis数据的下标(下标从0开始)
yAxis  标注位置Y轴   可以比值大点(标注在数据点上方)，也可以小点(标注在数据点下...]]></description><category></category></item><item><title><![CDATA[Jquery select2插件的几个常用方法]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85336334</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85336334</guid><author>wangcuiling_123</author><pubDate>Sat, 29 Dec 2018 11:27:20 +0800</pubDate><description><![CDATA[1、准备
首先引入jquery，然后引入select2的css样式文件与js脚本文件
2、常用方法
 $('select选择器').select2();  // 调用select2方法
 $('select选择器').val('val');  // 初始赋值
 $('select选择器').val('val').trigger('change');  // 动态更改值
 $('select选择器'...]]></description><category></category></item><item><title><![CDATA[layui table模块 获取表格中复选框选中的数据]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85336096</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85336096</guid><author>wangcuiling_123</author><pubDate>Sat, 29 Dec 2018 11:14:56 +0800</pubDate><description><![CDATA[table开启了复选框，获取所有选中的复选框中的表格数据，方法：
layui.table.checkStatus('table1').data;   // table1为表格id


]]></description><category></category></item><item><title><![CDATA[MongoDB数据备份和恢复]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85310693</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85310693</guid><author>wangcuiling_123</author><pubDate>Thu, 27 Dec 2018 22:09:23 +0800</pubDate><description><![CDATA[MongoDB数据备份和恢复
1 MongoDB数据库备份
1、语法：  mongodump -h dbhost -d dbname -o dbdirectory
    参数说明：
        -h： MongDB所在服务器地址，例如：127.0.0.1，当然也可以指定端口号：127.0.0.1:27017
        -d： 需要备份的数据库实例，例如：test
        -o：...]]></description><category></category></item><item><title><![CDATA[WebGL切换着色器 绘制不同物体]]></title><link>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85090612</link><guid>https://blog.youkuaiyun.com/wangcuiling_123/article/details/85090612</guid><author>wangcuiling_123</author><pubDate>Wed, 19 Dec 2018 10:46:36 +0800</pubDate><description><![CDATA[WebGL切换着色器 绘制不同物体
1、为何切换着色器
WebGL绘制不同的物体需要使用不同的着色器，每个着色器中可能有非常负责的逻辑以实现各种不同的效果。我们可以准备多个着色器，然后根据需要来切换使用它们。
2、如何实现切换着色器
为了切换着色器，首先创建多个着色器程序对象，然后在绘制之前选择使用的程序对象（使用gl.useProgram()函数来进行切换）。
下面是本次实例程序(实例程序绘制了...]]></description><category></category></item></channel></rss>