- 博客(28)
- 资源 (2)
- 收藏
- 关注

原创 自我介绍。。。
兄弟们好~我叫刘帅,现在是一名UI设计师,以前只接触过HTML和Jquery,在工作中渐渐接触到了前端,随着学习的深入发现自己喜欢的行业,但现在还是小白一枚,开博客的原因也是想记录一下自己学习和工作中遇到和解决的问题,因为还没有大佬的实力,暂时还不敢做详解,怕班门弄斧,弄巧成拙,所以写的内容更多的只是让自己巩固、理解。排版和文字确实非常混乱,这非常不UI,但想要精心写出一篇文章真的耗时太...
2019-02-13 14:14:13
175
原创 express路由学习练习
我靠这个路由有点蒙蔽 并没有看懂原理只能用。。源代码也并没有看懂 揪心。。。。。一定要深入研究下弄懂原理。。。首先:通过应用生成器工具 express 可以快速创建一个应用的骨架。安装在cmd中以管理员输入 : npm install express-generator -g设置视图模板在文件夹下shell中输入:express --view=ejs demo1常用操作expr...
2019-05-04 03:24:17
254
原创 express学习练习——基本使用
Express.js 框架是node.js后端框架之一, 相当于jQuery和js之间的关系;Express 不对 Node.js 已有的特性进行二次抽象,我们只是在它之上扩展了 Web 应用所需的基本功能;安装express:进入应用目录npm init 命令为你的应用创建一个 package.json 文件安装 Express 并将其保存到依赖列表中npm install ex...
2019-05-04 01:03:01
295
原创 mongoose学习练习
1.第一步安装node中输入: npm i mongoose --save基础设置//1.引入模块let mongoose = require('mongoose');mongoose.connect('mongodb://localhost/mongoose', {useNewUrlParser: true});//2.监听状态let db = mongoose.conne...
2019-04-26 18:49:25
234
原创 MongoDB——使用练习
mongoDB的基本指令show dbs:显示当前所有的数据库use 数据库名 : 进入到指定数据库中db : 显示当前所在的数据库show collections : 显示数据库中的所有集合小练习题目://1.创建并进入it_like数据库//2.向数据库的colleges集合中插入六个文档(Html5, Java, Python, 区块链, K12, <PHP, "世界上...
2019-04-24 20:00:29
910
原创 node文件读写小练习
let fs = require('fs');// 同步写法// let fd = fs.openSync('./aaa.txt','a');// fs.writeFileSync(fd,'力困筋乏');// fs.closeSync(fd);//异步写法(常用)// let fd = fs.open('./aaa.txt','w',(err,fd)=>{// if...
2019-04-23 18:48:23
152
原创 node学习练习01——客户端与服务器
首先是一些概念上的知识:C/S与B/SC/S与B/S是软件使用方式上两种划分具体分为:C/S全称Client/Server,是PC客户端、服务器架构特点:在服务器当中就主要是一个数据库,把所有的业务逻辑以及界面都交给客户端完成优点较为安全,用户界面丰富,用户体验好缺点每次升级都要重新安装,针对于不同的操作系统开发,可移植性差B/S全称Browser/Server,是浏览器/服务...
2019-04-21 20:29:44
241
原创 代码管理器学习练习
代码管理器顾名思义就是管理代码的工具。。帮助我们解决工作中的问题。开发过程中常见问题:代码回滚:返回到先前的某一特定的状态!代码合并:多人开发中,将各自开发的功能模块进行合并。版本备份:项目开发到某一可运行阶段后,进行备份。权限控制:限制不同用户访问或操作不同的文件。(小白不能碰核心代码吗- -)追究责任:项目出现了Bug后,可以快速定位到Bug是谁造成的。(防止甩锅。。)源代码...
2019-04-05 02:34:43
209
原创 圣杯双飞翼布局练习学习
这两个方法小弟也是早有耳闻…今天我就搞起来了!圣杯、双飞翼:两者的功能相同,都是为了实现一个两侧宽度固定,中间宽度自适应的三栏布局。圣杯布局来源于文章In Search of the Holy Grail,而双飞翼布局来源于淘宝UED遵循特点:两侧宽度固定,中间宽度自适应中间部分在DOM结构上优先,以便先行渲染允许三列中的任意一列成为最高列只需要使用一个额外的标签(练习中双飞翼貌...
2019-04-04 00:30:32
130
原创 H5学习练习——多媒体(音频视频)
H5学习练习——多媒体(音频视频)常用方法:load()、play()、pause()常用属性:currentSrc、currentTime、duration常用事件:oncanplay, ontimeupdate,onended 等具体地址:参考文档 <!DOCTYPE html><html lang="en"><head> <m...
2019-04-03 22:42:28
269
原创 H5学习练习——拖放
拖放概念:拖放是HTML5标准的一部分,任何元素都能够拖放。操作:拖拽:Drag、 释放:Drop注意:拖拽指的是鼠标点击源对象后一直移动对象不松手,一但松手即释放了拖放使用:设置元素为可拖放:draggable 属性:标签元素要设置draggable=true,否则不会有效果 (注意:链接和图片默认是可拖动的,不需要 draggable 属性。)常用API:被拖动的源对象可以...
2019-04-03 22:32:16
417
原创 js事件委托
作为一个面试经常问到的问题,我也是久仰大名- -,本以为是一个理论型的知识,但其实再工作中真的特别实用,项目中会不停的用到这个知识点。。网上的详解也是特别的多 推荐一篇比较不错的文章:事件委托这篇文章囊括了大多的知识点,而且浅显易懂推荐大家好好阅读一下,如下代码(文章的最后)也帮助我在工作中解决了不小的问题。 var oUl = document.getElementById('test')...
2019-03-31 19:24:30
114
原创 H5学习练习——本地存储、全屏
概念:如今网页应用越来越普遍,同时也变的越来越复杂,为了满足各种各样的需求,会经常性在本地存储大量的数据,HTML5规范提出了相关解决方案。本地存储分为sessionStorage、localStorage 其中他们有一些共同特性:读写方便,页面刷新不丢失数据存储容量较大,sessionStorage约5M、localStorage约20M只能存储字符串,可以将对象通过JSON.stri...
2019-03-30 19:43:43
172
原创 H5练习学习——网络状态,文件读取,图片读取
最近被项目搞得焦头烂额,虽然学了很多知识但是没时间一一记录了,有时间的话再补上吧~在app中我们经常可以看到未连接网络时会出现这种图片其实就是根据网络状态来控制图片是否显示 代码如下: let box = document.querySelectorAll('div')[0]; window.addEventListener('online',()=>{ bo...
2019-03-30 17:39:20
819
原创 bootstrap4学习记录2——进度条、模态图、轮播图
bootstrap4学习记录2——进度条、模态图、轮播图进度条:进度条是啥我想大家也都不会陌生,想要写出一个进度条基本设置如下:添加一个带有 .progress 类的 div。接着,在上面的 div 内,添加一个带有 class .progress-bar 的空的 div。添加一个带有百分比表示的宽度的 style 属性,例如 style=“width:80%” 表示进度条在 80% ...
2019-02-18 21:56:07
1017
原创 bootstrap4学习记录1——初始化、按钮与文字
boostrap小弟也是久仰大名了,今天正式进入学习,记录一下学习的内容。完整练习代码在最下方,有兴趣的同学可以一起尝试!Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架,用于开发响应式布局、移动设备优先的 WEB 项目。boostrap提供了一整套完善的、响应式的UI组件, 从PC端到移动端可以一站式开发,比较适合后台管理系统、门户官网:https://v4.bootcs...
2019-02-18 20:57:09
841
原创 less学习记录
less学习记录less个人理解就是一句话:用类似JS的语法去写CSS。less官网:http://lesscss.org/less中文网 :http://www.lesscss.cn/less作为CSS的一种扩展,LESS CSS不仅向下兼容CSS的语法,而且连新增的特性也是使用CSS语法。这样的设置使得学习LESS非常轻松,而且你可以在任何时候回退到CSS。说白了就是在less里可以按...
2019-02-17 01:10:25
289
3
原创 js重复执行延迟函数
js重复执行延迟函数var i = 0;function log() { if (i > 10) { clearTimeout(timer); return; } i++; console.log(i); var timer = setTimeout(log, 200);// 唯一重要一步定时器重复执行log函数...
2019-02-16 14:47:46
1200
原创 scrollReveal学习记录
scrollReveal学习记录scrollReveal是一个兼容PC端和移动设备的滚动动画库。不同的是 WOW.js 的动画只播放一次,而 scrollReveal.js 的动画可以播放一次或无限次;官网:https://scrollrevealjs.org/下载地址:https://github.com/scrollreveal/scrollreveal特点:1,scrollRevea...
2019-02-16 14:16:54
1380
1
原创 基于animate.css的插件库wow.js学习记录
基于animate.css的插件库wow.js学习记录昨天学习了一个超级实用简单的动画库animate.css往期回顾 - - :今天继续学习一个基于animata.css的动画类库wow.js官方网址:https://www.delac.io/wow/下载地址:https://github.com/matthieua/WOW/blob/master/dist/wow.js说明:WOW...
2019-02-16 14:00:08
418
原创 实用简单的css3动画效果插件animate.css学习记录
实用简单的css3动画效果插件animate.css学习记录被同事种草了一款css3动画插件,非常简单且实用。还没用过的小伙伴赶紧点击官网尝试一下,10分钟就能学会还在等什么!官方网站:https://daneden.github.io/animate.css/点击下方的Download Animate.css就可以下载,下载后引入就可以开始使用。<link rel="stylesh...
2019-02-16 12:14:40
783
原创 JS leetcoe.7练习 —— 问题:数组APi容易记不住
题目:给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整数,并返回他们的数组下标。你可以假设每种输入只会对应一个答案。但是,你不能重复利用这个数组中同样的元素。示例:给定 nums = [2, 7, 11, 15], target = 9因为 nums[0] + nums[1] = 2 + 7 = 9所以返回 [0, 1]假设我们的环境...
2019-02-13 20:16:39
223
原创 JS leetcoe.1练习 —— 问题:哈希算法是什么?
题目:给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整数,并返回他们的数组下标。你可以假设每种输入只会对应一个答案。但是,你不能重复利用这个数组中同样的元素。示例:给定 nums = [2, 7, 11, 15], target = 9因为 nums[0] + nums[1] = 2 + 7 = 9所以返回 [0, 1]解题思路:暴力...
2019-02-13 20:04:43
173
原创 块级标签居中 适用于翻页 fit-content
效果如图,之前想要把items居中,为了自适应要写一些js,绕来绕去很麻烦,偶然得知新的指令:fit-content 记录一下。fit-content可以自适应内容的长度,还能配合margin 0 auto 来居中省去很多麻烦。但fit-content也有一个小问题:如果一个元素的width已经设置过,再设置width:fit-content;会冲突。最终div的宽度以div内子元素的宽为准...
2019-02-13 13:38:13
228
原创 面向对象-拷贝属性-深拷贝——学习笔记
递归思想,重要的一步 var tmpObj = new fromValue.constructor; 通过原型链得出要创建的类型。赋值的这一步容易忘记toObj[key] = tmpObj;<script> // 1. 要拷贝的对象 var obj = { name: '小狗', age: 18, friends: ...
2019-02-12 20:49:09
249
原创 学习记录原型链——系统自带对象Date、Array默写
其实不难,但是第一次默写需要25分钟,第二次15分钟。。不知道为什么会这么慢,西街店也容易出现些小问题,比如少画一条线,可能还是没有理解透彻,下次争取没有错误突破10分钟。啊使用工具:processon...
2019-02-12 19:27:24
273
原创 登录框获得焦点删除文字——每次都忘怎么写系列
<input type="text" id="user" placeholder="请输入账号" onfocus="this.placeholder=''" onblur="this.placeholder ='请输入账号'"><input type="text" id="password" placeholder="
2019-02-12 19:13:41
184
原创 网页REM布局记录
window.onload = function(){resize()};window.onresize = resize;function resize() { let designSize = 1920; let html = document.documentElement; let wW = html.clientWidth; let rem = w...
2019-02-12 19:06:31
173
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人