- 博客(76)
- 收藏
- 关注
RSS订阅原创 页面显示多个倒计时简单案例
今天看到一篇关于页面显示多个倒计时的，发现代码存在一些错误，而且是采用了对象的方式，无法实现多个倒计时，一般这种是使用在购物商城多个商品倒计时，便自己写了以下这个简单的案例，采用构造函数，可实例化多个（已测试）：效果图：案例代码：<!DOCTYPE html><html lang="en"><head> &
2019-02-19 19:24:48
1289
转载 Three.js第三节(一个案例详解)
前面两节是根据官网写的three.js的简单案例，本节介绍一个教程书的案例(注意：本节案例的纹理图片为自行下载，纹理可随意选取textures文件夹下的纹理图片)效果图：案例代码：<!doctype html><html lang="en"><head> &a
2019-02-18 18:18:08
453
转载 Three.js第二节draw line
效果图：案例代码：<!doctype html><html lang="en"><head> <meta charset="UTF-8"> &
2019-02-14 16:03:46
559
转载 Three.js第一节Hello World
学习three.js第一节案例：创建一个立方体代码：<!DOCTYPE html><head> <meta charset="UTF-8"> <meta n
2019-02-13 17:55:59
220
转载 WebGL框架three.js
查看一个简单的案例：http://www.wjceo.com/blog/threejs/2018-02-07/3.html从今天开始，我学习WebGL基础将占时告一段落，开始学习WebGL的流行框架three.js。经验告诉我，学习一种语言，如果入门能力差，最好从框架开始学，虽然会被掩盖很多的原理方面的东西，但是，你能直接做出来一些东西，给自己充足的信心，能让自己做下去。如果你连东西都做不出来，...
2019-02-13 17:20:11
367
原创 mtl材质文件格式
示例mtl材质文件：#Blender MTL File: ‘’#Material Count: 2newmtl MaterialKa 0.000000 0.000000 0.000000Kd 1.000000 0.000000 0.000000Ks 0.000000 0.000000 0.000000Ns 96.078431Ni 1.000000d 1.000000illum ...
2019-02-02 16:27:46
4020
原创 理解obj模型文件的格式和每行的意义
示例obj模型文件：#Blender v2.60 (sub 0) OBJ File: ‘’#www.blender.orgmtllib cube.mtlo Cubev 1.000000 -1.000000 -1.000000v 1.000000 -1.000000 1.000000v -1.000000 -1.000000 1.000000v -1.000000 -1.000000...
2019-02-02 16:21:31
1249
原创 编程中的几种命名方法
在编程中，有个好的规范是很有必要的，下面介绍下前端常用的命名方法：一、匈利亚命名法匈牙利命名法是一种编程时的命名规范。基本原则是：变量名=属性+类型+对象描述，其中每一对象的名称都要求有明确含义，可以取对象名字全称或名字的一部分。要基于容易记忆容易理解的原则。匈牙利命名法的特点是前缀。用前缀标明变量的类型。前缀后面的单词首字母大写，其他字母小写。让人一看到变量名就能知道这个变量的类型。好像前端...
2019-02-01 16:53:31
6488
原创 火狐a标签download无反应--button和a标签冲突问题
情景：在做项目的时候，下载模板链接a标签放到了button标签内，在谷歌浏览器可以，可是在火狐点击就是没反应，查看了下，在火狐中根本就没有触发a标签点击事件，查了下原因如下：在火狐中，button内嵌套a标签，button 会覆盖标签，无法触发a标签的点击事件，所有无法下载，并不是火狐不支持a标签的download问题，在w3c上明确写明火狐是支持的。解决方法：方法一： 将外层button去...
2019-01-31 10:20:49
1807
原创 vue prop知识点
一、Prop的大小写HTML 中的特性名是大小写不敏感的，所以浏览器会把所有大写字符解释为小写字符。这意味着当你使用 DOM 中的模板时，camelCase (驼峰命名法) 的 prop 名需要使用其等价的 kebab-case (短横线分隔命名) 命名：Vue.component('blog-post', { ...
2019-01-30 09:48:39
308
原创 Vue+Webpack搭建多页面应用案例
注解：使用vue可以搭建单页面应用（SPA, Single-page Application），也可搭建多页面应用（MPA, Multi-page Application），在搭建多页面应用前，我们先看下单页面应用和多页面应用的区别以及各自的优缺点：一、单页面应用(SPA, Single-page Application)和多页面应用(MPA, Multi-page Application)的区...
2019-01-16 15:43:49
2189
1
原创 WebGL绘制阴影
一、本节概述：这一节我们来研究如何实现阴影。首先，实现阴影有很多方法，本节所介绍的方法采用的是阴影贴图(shadow map)，或称为深度贴图(depth map)。二、本节知识点：如何实现阴影实现阴影的基本原理：太阳看不见阴影。如果在光源出放置一位观察者，其视线方向与光线一致，那么观察者也看不到阴影。他看到的每一处都在光的照射下，而那些背后的，他没有看到的物体则处在阴影中。这里，我们需要...
2019-01-11 17:24:25
906
原创 WebGL以渲染的三维图像作为纹理
一、本节概述：WebGL渲染三维图形，然后将渲染结果做为纹理贴到另一个三维物体上去。实际上，把渲染结果作为纹理使用，就是动态的生成图像，而不是向服务器请求加载外部图像。在纹理图像被贴上图形之前，我们还可以对其做一些额外的处理，比如动态模糊和景深效果。二、本节知识点：帧缓冲区对象和渲染缓冲区对象在默认情况下，WebGL在颜色缓冲区中进行绘图，在开启隐藏面消除功能时，还会用到深度缓冲区。总之，...
2019-01-11 15:09:53
1982
1
原创 Layui table 多个表格获取某个表格的全部数据
layui table，获取table的全部数据，只需要一行代码即可：layui.table.cache.table // table为id当页面有两个或多个table实例时，获取其全部数据只需指定id即可： layui.table.cache.table // id为table layui.table.cache.table1 // id为table1...
2019-01-02 15:41:11
12319
3
原创 WebStorm 使用中常用的快捷键（自己整理，常用的）
在使用编辑器webStorm编辑代码时，使用一些快捷键，能很好的提高我们的开发效率，以下为我整理的平时常用的快捷键，（后续会继续添加）常用快捷键1、Ctrl + /: 单行注释2、Ctrl + Shift + /: 添加注释文本/块注释3、Ctrl + F: 查找文本4、Ctrl + R: 替换文本5、Ctrl + D: 复制行6、Ctrl + 鼠标单击： 跳到变量声明处...
2019-01-02 10:25:05
1851
原创 Echarts markPoint 标注自定义的使用
在使用Echarts图表时，我们很多时候需要标注自定义的数据(不止标注最大值，最小值)1. 标注最大值 最小值示例：2、自定义标注示例： 标注的是第二个和第六个值参数：value 为标注值xAxis 标注位置X轴 可以是x轴对应的值，也可以是xAxis数据的下标(下标从0开始)yAxis 标注位置Y轴 可以比值大点(标注在数据点上方)，也可以小点(标注在数据点下...
2018-12-29 16:02:50
28823
6
原创 Jquery select2插件的几个常用方法
1、准备首先引入jquery，然后引入select2的css样式文件与js脚本文件2、常用方法 $('select选择器').select2(); // 调用select2方法 $('select选择器').val('val'); // 初始赋值 $('select选择器').val('val').trigger('change'); // 动态更改值 $('select选择器'...
2018-12-29 11:27:20
827
原创 layui table模块 获取表格中复选框选中的数据
table开启了复选框，获取所有选中的复选框中的表格数据，方法：layui.table.checkStatus('table1').data; // table1为表格id
2018-12-29 11:14:56
14200
5
原创 MongoDB数据备份和恢复
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：...
2018-12-27 22:09:23
167
原创 WebGL切换着色器 绘制不同物体
WebGL切换着色器 绘制不同物体1、为何切换着色器WebGL绘制不同的物体需要使用不同的着色器，每个着色器中可能有非常负责的逻辑以实现各种不同的效果。我们可以准备多个着色器，然后根据需要来切换使用它们。2、如何实现切换着色器为了切换着色器，首先创建多个着色器程序对象，然后在绘制之前选择使用的程序对象（使用gl.useProgram()函数来进行切换）。下面是本次实例程序(实例程序绘制了...
2018-12-19 10:46:36
1780
原创 区分slice、splice、split、join方法
关于字符串和数组的方法，我们经常会用到，下面就详细的区分下slice、splice、split、join方法，加深下记忆并做个笔记。slice (数组)定义和用法 slice()方法提取部分的数组元素，返回包含提取元素的新数组，不会改变原数组。语法 arrayObject.slice(start,end) 参数 start（必选）: 指定提取部分...
2018-09-17 16:17:48
1073
原创 最简单的数组去重方式
代码：// 去除数组的重复成员[...new Set(array)]一行代码全部解决，原理：使用es6提供的新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。特点：１ 代码简单 ２ 可以去重NaN精确相等运算符（===）认为NaN不等于自身，而在Set内部，连NaN都是相等的，所以数组中的NaN都能去重，原因是Set内部是使用叫做“Same-value equality
2017-11-27 21:43:49
1441
原创 MongoDB配置环境变量
我们如果想在电脑的任意位置可以进行mongod命令，需要给其配置环境变量，很简单，步骤如下：一 右击计算机属性，打开高级设置二 选择环境变量三 编辑系统变量path四 新建变量，输入电脑中mongoDB下bin文件的路径重新启动mongoDB服务后，便可以在任意位置进行mongod命令了(查看版本)
2017-11-21 12:03:26
8375
原创 Node中exports和module.exports的区别
module.exports属性Node内部提供一个Module构建函数。所有模块都是Module的实例。每个模块内部，都有一个module对象，代表当前模块。它有以下属性。 module.id 模块的识别符，通常是带有绝对路径的模块文件名。 module.filename 模块的文件名，带有绝对路径。 module.loaded 返回一个布尔值，表示模块是否已经完成加载。
2017-11-21 00:36:14
289
原创 HTTP状态码
作为一个前端人员，进行http请求，经常会遇到不同的状态码，本人记性不太好，还是写一下吧，忘记了就看一下1 字头消息编辑 这一类型的状态码，代表请求已被接受，需要继续处理。这类响应是临时响应，只包含状态行和某些可选的响应头信息，并以空行结束。由于 HTTP/1.0 协议中没有定义任何 1xx 状态码，所以除非在某些试验条件下，服务器禁止向此类客户端发送 1xx 响应。100 Continue客户端
2017-11-20 22:36:21
222
原创 启动Node服务的几种方法
下面是以express框架为例，启动node服务的三种方法（已测试），使用express安装的文件如下：一 、使用node命令启动node server/bin/www二、使用webStorm启动1，打开webStorm,点击运行（run）下的编辑配置（Edit Configuration）2，添加新的配置3，命名并选择要执行的文件选择要执行bin/www文件4，启动node服务三、pm2启动1 安
2017-11-20 22:20:56
54093
原创 Express视图模板jade改为ejs,html模板
默认安装的express框架，官方推荐的是jade模板，虽然是很简洁，但是实在对这个jade不熟悉，还是改模板吧，下面介绍改成ejs，html视图，亲测无误。安装express生成器npm有点慢，采用cnpmcnpm i -g express-generator安装完成，查看版本express --version生成服务express server安装依赖cd servercnpm i生成的文件目
2017-11-19 17:12:18
1015
原创 Node创建服务并加载静态页面
创建HTTP服务，代码如下（server.js）：let http = require('http');let url = require('url');let util = require('util');let fs = require('fs'); let server = http.createServer((req,res)=>{ var pathname = url.parse
2017-11-18 23:59:18
4640
转载 理解 ES6 Generator 函数
Generator函数跟普通函数的写法有非常大的区别：一是，function关键字与函数名之间有一个星号； 二是，函数体内部使用yield语句，定义不同的内部状态（yield在英语里的意思就是“产出”）。最简单的Generator函数如下：function* g() { yield 'a'; yield 'b'; yield 'c'; return 'ending'
2017-11-15 23:28:21
380
原创 javascript总for of和for in的区别
不同：1. for in 是ES5的标准， for of 是ES6的标准2. for in 是遍历的键（key）, for of 是遍历的值（value）（1）for in 一般我们用来遍历普通对象的属性，当for in遍历数组时，会遍历出数组自定义和数组本身的属性 （2）for of 只会遍历出元素的value，不能循环遍历普通对象的属性，对象的属性遍历推荐for in，（ES6的Generat
2017-11-15 00:23:04
366
原创 indexOf方法和ES6的includes方法
includes和indexOf相比较：相同点：二者所传的参数是一样的，第一个参数传要判断的元素，第二个参数传开始检索的下标位置不同点：返回值不同1、indexOf：返回的是元素的所在下标，如果不存在则返回-1优点：元素存在可获取到元素的位置 缺点：(1)无法判断是否有NaN的元素(2)返回的值不够语义化，需要我们进行处理2、includes：返回一个Boolean值，有：true，没有：fals
2017-11-13 18:07:04
10616
原创 js实现简单拖拽案例
简单拖拽事件主要是监听三个事件：onmousedown, onmousemove, onmouseup 三个事件，思路也很简单，但是写的时候还是遇到了一些小问题，先放代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>拖拽事件案例</title> <style type="text/
2017-11-05 02:00:59
437
原创 实现对象深拷贝的简单案例
代码function deep() { var length = arguments.length; if (length <= 2) { if (length === 1) { return deep({}, arguments[0]); } else if (l
2017-11-04 22:49:49
451
转载 欢迎使用CSDN-markdown编辑器
欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来，用它写博客，将会带来全新的体验哦：Markdown和扩展Markdown简洁的语法代码块高亮图片链接和图片上传LaTex数学公式UML序列图和流程图离线写博客导入导出Markdown文件丰富的快捷键快捷键加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl
2017-11-04 22:38:22
151
原创 日期格式化方法
有时候我们页面里常常会格式化时间， 下面的就是一个简单的时间格式方法： function formatDate (date, fmt) { // 拼配fmt中的一个或多个y字符 if (/(y+)/.test(fmt)) { // 匹配成功 // RegExp.$1是匹配的y字符（'yyyy'）, 用时间的年份替换 fmt = fmt.re...
2017-10-20 17:44:45
579
转载 Sass、LESS 和 Stylus区别总结
现在的项目中越来越多的需要用到css预编译语言，现在的预编译语言主要就有sass,less,stylus，也是用的最多的，它们有什么不同呢？下面就是这三种语言的区别总结
2017-10-17 16:32:28
970
转载 scss语法介绍
scss语法介绍这里既然是对语法的介绍，那么至于如何安装和编译scss我就不多少了，主要是因为本人在群里认识的小伙伴有的不会用scss，所以就借着放假的机会来对scss语法做个总结，博主在开发过程中用scss蛮多，所以对scss语法还是熟知的。1.自定义变量$color:pink;.test1{ background-color:$color;}通过编译工具编译出来后...
2017-10-15 11:42:25
571
转载 弹性盒子Flex布局
2009年，W3C提出了一种新的方案—-Flex布局，可以简便、完整、响应式地实现各种页面布局。目前，它已经得到了所有浏览器的支持，这意味着，现在就能很安全地使用这项功能。Flex布局将成为未来布局的首选方案。本文介绍Flex布局的语法。以下内容主要参考了下面两篇文章：A Complete Guide to Flexbox 和 A Visual Guide to CSS
2017-09-25 18:01:08
338
转载 数组去重常见的三种方法
第一种是比较常规的方法思路：1.构建一个新的数组存放结果2.for循环中每次从原数组中取出一个元素，用这个元素循环与结果数组对比3.若结果数组中没有该元素，则存到结果数组中 代码如下:Array.prototype.unique1 = function(){var res = [this[0]];for(var i = 1; i < this.length; i++){
2017-09-14 18:47:11
821
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人