- 博客(56)
- 收藏
- 关注
RSS订阅转载 express-CRUD
入口文件/** * app.js 入门模块 * 职责： * 创建服务 * 做一些服务相关配置 * 模板引擎 * body-parser 解析表单 post 请求体 * 提供静态资源服务 * 挂载路由 * 监听端口启动服务 */var express = require('express')var router = require(...
2019-01-10 14:20:13
286
转载 nodeJs留言板 实现
1.两个页面 ①首页 ② 输入留言内容页面如图：功能实现：1.点击‘ 发表留言按钮’ 跳转至 post.html页面输入信息。2.在post.html页面中，点击 首页 会重新跳回 index.html（注意路径），点击 ‘确认发表’ 会在默认的留言列表中新增，并且跳回首页。涉及知识点：1.服务器构建。核心模块 http引入、端口设置2.url核心模块： 页面的跳转是通过对ur...
2019-01-07 13:57:16
3470
原创 核心模块相关API
API作用fs.access(path, callback)判断路径是否存在fs.appendFile(file, data, callback)向文件中追加内容fs.copyFile(src, callback)复制文件fs.mkdir(path, callback)创建目录fs.readDir(path, callback)读取目录列表...
2019-01-03 22:03:19
280
原创 node.js基础-核心模块
一、fs核心模块1.fs文件读取核心模块被读取文件为 1.txt 内容为aaavar fs = require('fs')// 2.文件读取// readFile('路径',反馈函数)fs.readFile('./1.txt',function(err,data){ // 3.文件读取成功 err则为null，err如存在即读取失败，抛出提示 if(err){ ...
2019-01-03 21:56:33
177
原创 node结合模板引擎呈现文件列表
// node属于服务端，属于在服务端使用 模板引擎// 安装 npm install art-template// 在需要使用的文件模板中加载 art-template.加载方式： 类似于 node中加载核心模块一样加载// 浏览器的引入方法：template('script 标签id',{对象})var template = require('art-template')var ...
2019-01-03 16:43:40
267
原创 webpack配置
webpack4.0以上的1.全局安装 webpack 、webpack-cli2.init之后再package.json中scripts中添加：“dev”:“webpack --mode development”,“build”:“webpack --mode production”3.npm run dev 就可以直接打包成dist下的main.js了前提：根目录下有src，sr...
2018-12-23 16:00:02
108
原创 vue语法、属性、初识
我们要知道：Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统。数据经过Vue与DOM建立关联，所有的东西都是响应式的。vue包含：----------------------1.指令：v-开头。-----v-bind：<div id="app-2"> <span v-bind:title=&q
2018-12-16 17:12:52
171
原创 写在VUE之前的ES6
一、较ES5的一些新增1.内置对象扩展①使用符号 ` 和$ ，模板字符串（类似于模板引擎中的占位符）,通过${} 把字符串引入例1:数组的扩展Array.from: 把一串节点变成数组。Array.of ：把一组零碎的数据变成数组对象的扩展：①当由外部数据传入对象的时候，如果键名和值名是一样的，可以省略其一。例: let name = 'zhangsan'; ...
2018-12-16 15:47:34
176
原创 canvas补充
在绘制三角形的过程中。因为使用beginPath()和closePath()会自动闭合，这使得我们会忽略一个问题。当使用最原始的lineTo，一个点一个点连接，你会发现，最后一条线回到初始点的时候，产生了空缺。这是closePath()中不会产生的。1.closePath() ctx.beginPath(); ctx.moveTo(100,100); ...
2018-12-14 16:52:08
142
原创 transition过渡 和animation 动画
1.要有过渡的属性2.告诉系统属性需要执行的效果3.必须要有过渡的时长在需要进行过渡的元素内添加：transition-duration: 5s;//过渡的时长transition-property: margin-left;// 需要过渡的属性---------2d旋转transform rotate（xdeg）旋转transform translate（左方向水平距离，下方向...
2018-12-10 16:54:28
856
转载 Canvas
canvas通过js在网页上绘制图像。是一个矩形区域，可以绘制路径，矩形，圆形等。1.创建canvas对象、 <canvas id="mycan" width="300" height="300">&amp
2018-12-10 15:03:04
152
转载 放大镜案例
运用了两种思路。显示半透明遮罩层的思路都一致，在放大的图片框中移动采用了不同的方法。1.第一种实现原理:①鼠标移入over：遮罩层和大图显示；移出out：遮罩层和大图消失②鼠标移动move：遮罩层跟随鼠标移动。（可以参考拖拽）③大图部分：实现大图跟着遮罩层一起移动的效果，使用了scrollLeft（？）代码部分：left.onmousemove = function(e){ ...
2018-11-29 17:15:32
242
原创 在线JSONP接口调用
http://api.asilu.com/#image-baidu通过在ajax中url中设置接口，可以实现调用。例子：实现查询手机号码归属地的功能 $('input').eq(2).click(function(){ var phoneNum = $('#phoneNum_input').val(); // console.log(phoneNum); $.ajax({ url...
2018-11-26 21:56:19
2238
转载 php-机器人聊天（3个版本）
1.超超超超级简易的聊天机器人，只会说“你好”连接php之后，不管后端接收到啥信息只输出“你好”给前段，这样前段就可以发啥对面都会说“你好”。–php部分<?php echo "你好！";-html部分 <h2>第一版</h2> <input type="text" class="myContent"> &a
2018-11-22 13:53:18
3011
转载 发送请求全过程
1.请求行：xhr.open("get","xxx.php");2.请求头参数1：键名参数2：值xhr.setRequestHeader('haha','goodday!');3.请求主体发送xhr.send();
2018-11-19 14:22:53
169
翻译 ajax-php实例
简易登录界面与后台服务器连接，在这里，我们模拟service.php为后台服务器。功能实现：在登录界面中输入姓名年龄和性别，点击注册按钮，信息传回服务器，再将输入的信息显示在“注册结果”的显示框中。实现图片：注意：在ajax中是以对象的格式传入php，在php中以json的形式传回页面。1.将输入框中获取到的信息包裹成对象：var name = $(&quot;#yourName&quot;).val()...
2018-11-16 17:06:00
355
原创 简易版打字机（只有大写字母的）
1.根据ASCII码值转化成对应的字母或字符： char = String.fromCharCode(ASCword);2.显示正确率：防止出现无限小数，.toFixed(2)可以只保留两位小数resultBox.innerHTML = "正确："+correct +"个"+" 错误："+ error+"个"+"正确率："+percent.toFixed(2)+"%"
2018-11-15 13:55:02
362
原创 轮播图-again-
巩固知识又做一遍轮播图。方法有点不同，思路都是一致的。功能：①页面初始，5张图片1秒依次播放（与之前不同的是：之前是缓慢移动每次加固定像素，这次的是每次就展现一张图片，没有缓慢移动的步骤）②事件绑定：1.鼠标移入：轮播停止；鼠标移出：轮播继续。2.prev前一个按钮：点击图片向前播放；next后一个按钮：点击图片向后播放。3.跟随图片序号，底部序号依次变换状态。实现图片：注意：1....
2018-11-14 17:11:04
145
原创 九宫格抽奖案例
1.简单布局，就9张图片，抽奖按钮2.在点击“抽奖”按钮之后，开启定时器。将九宫格九个获奖信息存入对象中，根据索引值设置提示内容（恭喜获得xxx）；3.在定时器中，根据索引值让每个图片执行被选中的状态。 $("img").eq(index).addClass("cur");$("img").eq(index).siblings().removeClass("cur");index++;...
2018-11-13 15:15:39
1724
原创 js/jq 扫雷
1.给每个小格子设置id “i-j”的格式。在获取的时候，split（“-”）获取它所在的行数和列数。split出来的是数组类型，包裹行数和列数两个字符串，在获取的时候：x = splitArr[0];需要改成x = parseInt（splitArr[0]）;不然会出错。...
2018-11-13 10:21:34
201
原创 奇怪的jq选择器
① ：gt(num) 选取 index 值高于num的元素。② ：lt(num) 选取 index 值低于num的元素。如果gt和lt同时存在, 后面一个是以前面一个的结束位置的下一个作为0角标。例子：$('li:gt(2):lt(9)').hide();//是index从2开始，涵盖9个li元素（可以这样理解）...
2018-11-13 10:20:54
137
转载 JQ下的ajax
①$.ajax()var configObj = { method //数据的提交方式：get和post url //数据的提交路劲 async //是否支持异步刷新，默认是true data //需要提交的数据 dataType //服务器返回数据的类型，例如xml,String,Json等 ...
2018-10-29 14:57:58
100
原创 关于get/post数据传输的一些小
1.form表单简单的提交文件，并转存在指定的文件中利用html+Php文件结合。 <form action="03-post0file.php" method="POST" enctype="multipart/form-data"> <input type="file" name="upFile" id=""&g
2018-10-28 23:06:51
176
转载 诶债克斯
定义： 不是新的编程语言，而是一种使用现有标准的新方法。AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行。Ajax就是用 JS 发起一个请求，并得到服务器返回的内容。这跟以前的技术最大的不同点在于「页面没有刷新」，改善了用户体验，仅此而已。①$.ajax()var co...
2018-10-15 10:51:28
126
原创 QQ音乐实例
JS：事件1：每一条音乐（类名list_music）的鼠标悬停事件：①list_menu会显示②歌曲时长会隐藏③删除小图标显示。注意：在①在选择到每个list_music的时候，操作的对象是该list_music下的list_menu，而不是直接选择list_menu,区别在于，如果是后者的话，鼠标悬停在任何一个list_music的时候，其他的list_music下的list_menu都是显...
2018-10-11 11:34:25
650
翻译 【查漏补缺】清除浮动
一、cleat:both;二、父容器使用overflow: auto;使用这种方法，必须定义width或者zoom,而且不能设置高度height，优点是代码少，缺点是不能使用position,否则超出的元素将会被隐藏zoom是IE专有属性zoom是设置或检索对象的缩放比例。设置或更改一个已被呈递的对象的此属性值将导致环绕对象的内容重新流动。虽然此属性不可继承，但是它会影响对象的所有子对...
2018-09-30 14:04:49
106
翻译 JQuery事件、默认行为及取消冒泡
jQuery中事件绑定有两种方式① eventName(function(){})绑定对应事件名的监听, 例如：$(’#div’).click(function ( ){ });②on(eventName, funcion(){})通用的绑定事件监听, 例如：$(’#div’).on(’ click ', function( ){ });事件解绑jQuery中可以通过off(eve...
2018-09-29 16:17:33
268
翻译 JQuery的CSS操作21
1.逐个设置$(‘div’).css(‘width’，’ 100px ‘);$(‘div’).css(‘height’，’ 100px ‘);$(‘div’).css(‘background’，’ red’);2.链式设置( 超过3个不建议使用)$(‘div’).css(‘width’，’ 100px ‘).css(‘height’，’ 100px ‘).css(‘background...
2018-09-28 23:27:39
338
翻译 JQuery属性操作
什么是属性对象身上保存的变量。如何操作属性对象.属性名什么是属性节点在编写 HTML代码时。在HTML标签中添加的属性就是属性节点。只有DOM元素才有元素节点，保存在Attributes如何操作属性节点设置：DOM.setAttribute（‘属性名称’，‘值’）获取：getAttribute(‘属性名称’)属性和属性节点有什么区别？任何对象都有属性。但是只有DOM对象才有属...
2018-09-28 17:28:50
147
翻译 JQuery核心函数和静态方法
首先，搞清楚静态方法和实例方法的区别：①静态方法是直接在类上添加，通过引用类名调用。例： //1.定义一个类 function Aclass(){ } //2.给这个类添加静态方法 //直接添加给类的就是静态方法 Aclass.staticMethod = function(){ alert('静态方法');...
2018-09-28 15:31:53
214
翻译 JQuery
优点：写法简洁；支持css1至css3；无浏览器兼容性问题。常用的基本选择器：①#id：$（“#id”）②.class: $（“.class”） 选取所有class名为class的元素③标签选择： $（“div”）选取所有的div标签④*：所有元素， $（“ * ”）层次选择器：①div父集中的所有span集：$（“div span”） 【不仅子集，子集的子集也会被包含】②d...
2018-09-27 14:51:49
115
翻译 正则表达式RegExp
课前补充：转义字符：\，反斜杠后面的字符取消掉原来的意思，转成文本\ 会输出一个\r :行结束\n :换行\t : 缩进 table键应用：在js中添加innerHTML的时候，等号右边是字符串，如果写入的代码有回车，浏览器会报系统解析错误。 那在每一行代码后面加一个\，再回车，就不会报错。正则表达式作用：匹配特殊字符或...
2018-09-25 16:03:53
370
翻译 简易的倒计时demo
要点：①明确Date类型数据的计算原理。当前时间与给定事件之间的差需要计算出来，每个Date数据转换成数值都是距离1979年1月1日的毫秒数，所以，算出来差值再除以1000，得出当前时间与给定事件的秒数间隔。要分别得出，天数/时/分/秒。 var nowTime = new Date(); var stopTime = new Date(2018,8,25,15,30,0); var...
2018-09-25 14:58:12
197
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人