- 博客(20)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 Vue---过渡
先看一个典型的例子：HTML：<div id="app"> <button @click="show=!show">切换</button> <transition name="fade"> <p v-if="show">Hello</p> &am
2018-06-15 14:57:21
206
原创 Vue-----Class与Style绑定
1.1绑定HTML Class我们可以传给 v - bind : class 一个对象，以动态地切换 class 。这里 v-bind ： class 可以和普通的 class 共存。<div id="app" class="static" v-bind:class="{'didi-orange': isRipe,'didi-green':isNotRipe}"> </div&g...
2018-06-15 11:34:40
171
原创 阻塞代码与非阻塞代码实例
阻塞代码实例//阻塞代码实例var fs=require('fs');var data=fs.readFileSync('input.txt');console.log(data.toString());console.log("程序执行完毕！");非阻塞代码实例//非阻塞代码实例var fs = require('fs');fs.readFile('input.txt',functi...
2018-06-15 10:30:31
2259
原创 第一个node.js服务器应用
首先我们编写js文件如下var http=require('http');http.createServer(function(request,response){ //发送HTTP头部 //HTTP状态值：300：OK //内容类型： text/plain response.writeHead(200,{'Content-Type':'text/plain'}); //发送响应数据...
2018-06-15 10:02:33
143
原创 如何用命令行工具打开node文件
1. 先检测系统是否安装nodejs,在命令行中输入 node -v,如果显示版本号，则说明已经安装成功了。2. 新建一个用来保存node.js文件的文件夹，并在命令行中打开我的文件夹放在D盘的node.js文件夹中在文件夹中新建一个js文件然后在命令行中打开控制台打印输出 Hello Wrold 说明文件运行成功。...
2018-06-15 09:49:41
7487
原创 Node.js中的交互式运行环境----REPL
在node.js中,为了使开发者方便测试JavaScript代码,提供了一个名为REPL(Read-Eval-Print-Loop)的可交互运行环境.开发者可以在该运行环境中输入任何JavaScript表达式,当用户按下回车键后,REPL运行环境中将显示该表达式的运行结果.1.1 REPL运行环境概述 按下win+r,输入cmd,打开命令工具在命令行中,输入"node"命令并...
2018-06-15 09:30:18
671
原创 Vue--自定义过滤器
1.单个参数HTML<p v-text="message | reverse"></p>自定义过滤器Vue.filter('reverse',function(value){ return value.split('').reverse().join(''); })脚本数据message: 'abc',浏览器显示结果2.多参数<p>{{msg}}的三次...
2018-06-14 17:14:34
218
原创 Vue--过滤器limitBy fiterBy orderBy
1.1字母操作<li> 1.1字母操作 <ul> <li> 1.capitalize(首字母大写) <p>deng：{{'deng' | capitalize}}</p> </li> ...
2018-06-14 17:05:34
2423
1
原创 Vue之表单控件绑定
1.text<p>text输入文本</p> <span>Hello {{name}}</span> <input type="text" v-model="name" placeholder="yous name" name="">2.checkbox <p&
2018-06-14 16:39:30
223
原创 Vue--计算属性（getter/setter）
通常我们会在模板中绑定表达是，模板是用来描述视图结构的。如果模板中的表达式存在过多逻辑，模板就会变得臃肿不堪，难以维护。为了简单逻辑，当某个属性依赖于其他属性的值时，我们可以使用计算属性。什么是计算属性计算属性就是当其依赖属性的值发生变化时，这个属性的值会自动更新，与之相关的DOM部分也会同步更新。<div id="example"> <input type="text" v...
2018-06-14 16:28:38
4059
1
原创 v-指令 v-if v-else v-show v-for v-on
1.v-if/v-elsev-if指令可以完全根据表达式的值在DOM中生成或移除一个元素。v-else必须跟着v-if，充当else功能。<div id="example"> <p v-if="greeting">Hello</p> <p v-else="greeting">Hi</p> &
2018-06-14 16:04:28
349
原创 Vue-指令 v-text v-html v-model v-bind
1.v-text<div id="app"> <span v-text="msg"></span></div>var app=new Vue({ el: "#app", data:{ msg: 'Hello Wrold', } })最后不要忘了前面加上脚步引入<script src=&qu
2018-06-14 15:28:42
934
原创 canvas绘制动态电子表
电子表在线地址:点击打开链接电子时钟截图动态电子表实现思路1.利用数组绘制不规则图形 需要绘制的图形有 0 1 2 3 4 5 6 7 8 9 : 要绘制的图形数组为[0,0,1,1,1,0,0], [0,1,1,0,1,1,0], [1,1,0,0,0,1,1], [1,1,0,...
2018-06-12 22:23:59
517
原创 HTML制作一个简易计算器小应用
先展示UI界面先进行逻辑分析1.界面外层长250px，宽600px用来显示计算器主界面分上下结构 上：用来显示数字 1.显示结果 2.显示输入数字 下：用来显示按钮 ul li button 依次为 AC +/- % / ...
2018-06-12 16:27:40
35685
9
原创 canvas实现动画时钟
实现效果如下：1.创建canvas元素<canvas id="drawing" width="200" height="200">没有金刚钻就不要揽瓷器活</canvas>2.绘制双圆var drawing=document.getElementById("drawing"); if(drawing.getContext){ var context
2018-06-11 14:07:24
381
原创 canvas实现匀速运动
话不多说先贴代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>匀速运动</title> <style type="text/css"> #drawing
2018-06-11 10:22:11
884
原创 phpstorm修改快捷方式
分屏编程 多处同时编写 Alt+鼠标左键就可以选择多个光标位置进行同时编写了 选择相同的内容进行更改 Alt+j 快速选择内容 双击内容 自己更改快捷方式 1.) Ctrl+Alt+s 打开下面界面 也可以 打开这个之后就可以选择你想要修改或者添加的快捷方式了。 你可以自己直接搜索 也可以直接从列表中选择 然后选择 Add Keyboard Shortcut ,直接键盘...
2018-06-08 17:37:30
863
原创 canvas绘制时钟表盘
关于canvas的API操作详情请阅读文档https://www.runoob.com/html/html5-canvas.html先来看下效果图：首先，需要绘制两个圆形作为表盘var drawing=document.getElementById("drawing");var context=drawing.getContext("2d");context.beginPath();//绘...
2018-06-08 16:36:24
2058
转载 HTML5 canvas
什么是 canvas?HTML5 <canvas> 元素用于图形的绘制，通过脚本 (通常是JavaScript)来完成.<canvas> 标签只是图形容器，您必须使用脚本来绘制图形。你可以通过多种方法使用 canvas 绘制路径,盒、圆、字符以及添加图像。创建一个画布（Canvas）一个画布在网页中是一个矩形框，通过 <canvas> 元素来绘制.注意: 默认情...
2018-06-08 16:25:42
136
原创 用canvas画布画一个二次函数
今天是高考第二天了，看了一会昨天高考数学卷，刚好又在学习canvas这部分内容，所以突发奇想的或一个二次曲线图。首先，我们需要创建一个400*800的画布并让其居中显示<canvas id="drawing" width="400" height="800" style="margin:100px auto;display: block;"></canvas>第二步，我们创
2018-06-08 15:27:33
2093
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人