自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(47)
  • 收藏
  • 关注

原创 node.js6 npm

如何上传1 注册2 npm init 3 npm login4 npm publish删除npm unpublish安装npm i  查询是否存在 XXX 这个包和版本npm view XXX version

2019-02-26 11:30:40 206

原创 node.js5 自定义模块

var a = require("./a")./  在当前目录找没有./ 先找系统文件(高优先级),再到node_modules里找----------------------------exports.amodule.exports={ }//-------//ES6中的模块导出导入export 和 export default...

2019-02-26 11:27:20 154

原创 node.js4 post

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <form action="http://localho

2019-02-22 11:40:29 2565

原创 node.js3-get

const http = require("http")const _url = require("url")http.createServer((req,res)=>{ //console.log(req.url) // /a?name=1&password=123 let urlQuery = _url.parse(req.url,true) console.log...

2019-02-22 11:20:26 164

原创 node.js2 - fs

readFile("文件名",(err,data)=>{console.log(data)})const http = require("http")const fs = require("fs")let server=http.createServer((req,res)=>{    let fileName = './www'+req.url    fs.readFi...

2019-02-21 17:47:55 120

原创 node.js1-http

const http = require("http")let server=http.createServer((req,res)=>{  //req 进入服务器 res 传出    res.write("hello,world")    res.end()})server.listen(3301)

2019-02-21 17:45:47 95

原创 javascript中function前面加(/!/+/-/~的含义

自执行匿名函数 常见格式:(function(){ /* code */ })(); 解释:包围函数(function(){ /* code */ })的第一对括号向脚本返回未命名的函数,随后一对空括号立即执行返回的未命名函数,括号内为匿名函数的参数。 作用:可以用它创建命名空间,只要把自己的所有代码都写在这个特殊的函数包装内,那么外部就不能访问,除非你允许(变量前加上window,这样该函数后变...

2018-09-21 13:42:49 484

原创 BASE64编码的图片在网页中的显示问题的解决

BASE64位转码有两种:一种是图片转为Base64编码,这种编码是直接可以在页面通过<img src='base64编码'/>的方式显示Base64 在CSS中的使用.demoImg{ background-image: url("data:image/jpg;base64,/9j/4QMZRXhpZgAASUkqAAgAAAAL...."); }Base64 在HT...

2018-09-15 16:42:42 2584

原创 flex笔记

=== 容器属性 ===--------------flex-direction:row|row-reverse|column|column-reverse---------flex-wrap:nowrap(default)|wrap|wrap-reverser(第一行在下面,从底部开始)---------flex-flow:row nowrap(default)(flex-dir...

2018-09-01 16:15:16 112

原创 position: absolute 垂直居中

top:50%;margin-top:-1/2高度

2018-08-31 22:10:28 2629

转载 Vue动态组件

前面的话  让多个组件使用同一个挂载点,并动态切换,这就是动态组件。本文将详细介绍Vue动态组件 概述  通过使用保留的 <component> 元素,动态地绑定到它的 is 特性,可以实现动态组件<div id="example"> <button @click="change">切换页面</button> <c

2018-08-30 01:02:35 11221 2

原创 v-else-if

<div id="app5"> <div v-if="status == 'loading'"> <div style="background-color:blue">loading</div> </div> <div v-else-if="

2018-08-29 15:02:18 388

原创 vue实现原理

Vue 他的模型设计就是MVVM,分为视图view,数据模型层Model,视图数据层viewModel,视图数据层通过Ajax向数据模型层交互数据,通过对model层拿到的数据进行二次封装,然后渲染到视图层上面。MVVM作为数据绑定的入口,整合Observer、Compile和Watcher三者,通过Observer来监听自己的model数据变化,通过Compile来解析编译模板指令,最终...

2018-08-15 11:19:49 999

原创 Vue.js+Koa2电商实战笔记

1.项目初始化 npm -v  //确认安装node基本环境npm i vue-cli -g //-g 全局安装vue-clivue init webpack //使用webpack模板安装 不安装eslint,eslint用于多人开发,按照谷歌和facebook的代码标准开发。unit --no //大公司有专门测试人员ese  --no  packa...

2018-08-15 00:58:54 2715 1

原创 js中的逻辑与(&&)和逻辑或(||)

之前有一个同事去面试,面试过程中碰到这样一个问题:在js中写出如下的答案 :var a = 2;var b = 3;var andflag = a && b ;var orflag = a || b;问andflag 和orflag 分别是什么?起初我认为: andflag 和orflag 的值都为 true; 毕竟 && 和 || 都是...

2018-08-04 12:38:18 1087

原创 Sticky footer布局

Sticky footer布局是什么?我们所见到的大部分网站页面,都会把一个页面分为头部区块、内容区块和页脚区块,当头部区块和内容区块内容较少时,页脚能固定在屏幕的底部,而非随着文档流排布。当页面内容较多时,页脚能随着文档流自动撑开,显示在页面的最底部,这就是Sticky footer布局。图示说明当内容较少时,正常的文档流效果如下图在正常的文档流中,页面内容较少时,页脚部分不是...

2018-08-04 12:11:39 125

转载 史上最全的CSS hack方式一览

做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况。基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现。我个人是不太推荐使用hack的,要知道一名好的前端,要尽可能不使用hack的情况下实现需求,做到较好的用户体验。可是啊,现实太残酷,浏览器厂商之间历史遗留的问题让我们在目标需求下不得不向hack妥协,虽然这只是个别情况。今天,结合自己的经...

2018-08-04 12:10:39 154

原创 less 基本配置 参考

globe.less@rem:30rem;body,h1,h2,h3,h4,p{ margin:0;}body{ font-size:26/@rem; font-family: '微软雅黑'; color: #738797;}a{ text-decoration: none; color: inherit;}a:hover{ color: #f...

2018-07-22 00:07:28 1200

原创 VsCode中使用Emmet神器快速编写HTML代码

一、Emmet简述Emmet (前身为 Zen Coding) 是一个能大幅度提高前端开发效率的一个工具. 在前端开发的过程中,一大部分的工作是写 HTML、CSS 代码。特别是手动编写 HTML 代码的时候,效率会特别低下,因为需要敲打很多尖括号,而且很多标签都需要闭合标签等。于是,就有了 Emmet,它可以极大的提高代码编写的效率,它提供了一种非常简练的语法规则,然后立刻生成对应的 HTM...

2018-07-21 23:31:51 680

原创 vscode 常用配置和插件

vs code如何配置.less编译为.css安装插件 Easy LESS,保存自动编译,不需要配置 推荐了几个自认为比较好的要求配置项目比较低的VS code扩展插件:Html Snippets——html代码提示easy less——css编程/生成VS color Picker——颜色选择器live HTML Previewer——html文件运行预览SVG ...

2018-07-21 23:15:38 861

原创 JS基础--HTML DOM classList 属性

页面DOM里的每个节点上都有一个classList对象,程序员可以使用里面的方法新增、删除、修改节点上的CSS类。使用classList,程序员还可以用它来判断某个节点是否被赋予了某个CSS类。添加类(add)document.getElementById("myDIV").classList.add("mystyle");为 <div> 元素添加多个类:docum...

2018-07-19 23:43:56 347

原创 getBoundingClientRect的用法

getBoundingClientRect用于获取某个元素相对于视窗的位置集合。集合中有top, right, bottom, left等属性。1.语法:这个方法没有参数。rectObject = object.getBoundingClientRect();2.返回值类型:TextRectangle对象,每个矩形具有四个整数性质( 上, 右 , 下,和左 )表示的坐标的矩形,以像素...

2018-07-19 23:43:02 384

原创 ES6 对象

 <!DOCTYPE HTML><html><head>    <title>对象</title>    <meta charset="utf-8" />    </head><body><script>clas

2018-07-18 14:12:20 99

原创 CSS3的基础知识点

  1、CSS背景(1)、background-size 属性background-size 属性规定背景图片的尺寸,同时适用与字体图标方面的适用(主要在移动端用到较多)。在 CSS3 之前,背景图片的尺寸是由图片的实际尺寸决定的。在 CSS3 中,可以规定背景图片的尺寸,这就允许我们在不同的环境中重复使用背景图片。您能够以像素或百分比规定尺寸。如果以百分比规定尺寸,那么尺寸相...

2018-07-16 22:50:06 414

原创 html5的localStorage操作

var Util =  (function(){ var prefix = 'ficiton_reader_'; var StorageGetter = function(key) { return localStorage.getItem(prefix + key); } var StorageSetter = function(key, val) { ...

2018-07-04 20:25:17 153

原创 Vue - 内置组件 -slot 父组件向子组件传值

slot是标签的内容扩展,也就是说你用slot就可以在自定义组件时传递给组件内容,组件接收内容并输出。先来定义一个<jspang></jspang>的组件,这个组件用来显示博主的一些信息。我们在Vue 构造器里的data中给出了信息,信息如下:(博客地址,网名,使用技能)1234567data:{    jspangData:{        bolgUrl:'http:/...

2018-07-03 13:57:43 6095

原创 VUE - 实例事件

实例事件就是在构造器外部写一个调用构造器内部的方法。这样写的好处是可以通过这种写法在构造器外部调用构造器内部的数据。我们还是写一个点击按钮,持续加1的例子。一、$on  在构造器外部添加事件。1234app.$on('reduce',function(){    console.log('执行了reduce()');    this.num--;});$on接收两个参数,第一个参数是调用时的事件名...

2018-07-03 13:29:18 256

原创 Vue和Jquery.js一起使用

1、下载并引入jquery框架下载可以去官网进行下载,我这里使用的版本是3.1.1,下载好后在需要的页面引入就可以了。当然你还有很多其它的方法引入jquery,只要可以顺利引入就可以了。1<script type="text/javascript" src="../assets/js/jquery-3.1.1.min.js"></script>试着作一个案例,在DOM被挂载...

2018-07-03 12:33:15 8537

原创 VUE- delimiters 选项

delimiters的作用是改变我们插值的符号。Vue默认的插值是双大括号{{}}。但有时我们会有需求更改这个插值的形式。1 delimiters:['${','}']现在我们的插值形式就变成了${}。代替了{{ }}...

2018-07-03 11:23:12 7038

原创 VUE- Mixins 混入选项操作 和 extends

Mixins一般有两种用途:1、在你已经写好了构造器后,需要增加方法或者临时的活动时使用的方法,这时用混入会减少源代码的污染。2、很多地方都会用到的公用方法,用混入的方法可以减少代码量,实现代码重用。一、Mixins的基本用法我们现在有个数字点击递增的程序,假设已经完成了,这时我们希望每次数据变化时都能够在控制台打印出提示:“数据发生变化”.代码实现过程:123456789101112131415...

2018-07-03 11:04:44 548

原创 VUE - watch

数据变化的监控经常使用,我们可以先来看一个简单的数据变化监控的例子。例如天气预报的穿衣指数,它主要是根据温度来进行提示的,当然还有其它的,咱们就不考虑了。一、看一个监控变化的案例温度大于26度时,我们建议穿T恤短袖,温度小于26度大于0度时,我们建议穿夹克长裙,温度小于0度时我们建议穿棉衣羽绒服。先来模拟一个温度变化的情况:我们使用按钮来加减温度。<div id="app"> ...

2018-07-03 10:44:15 344

原创 VUE - Methods

一、methods中参数的传递使用方法和正常的javascript传递参数的方法一样,分为两部:1、在methods的方法中进行声明,比如我们给add方法加上一个num参数,就要写出add:function(num){}.2、调用方法时直接传递,比如我们要传递2这个参数,我们在button上就直接可以写。<button @click=”add(2)”></button>.现...

2018-07-03 10:22:17 458

原创 VUE - computed 计算属性 ( get set )

computed 的作用主要是对原数据进行改造输出。改造输出:包括格式的编辑,大小写转换,顺序重排,添加符号……。这样可以不污染数据源。<!doctype html><html><head><meta charset="utf-8"><title>vue</title><script src=&am

2018-07-03 09:43:10 842

原创 VUE - propsData Option 全局扩展的数据传递

propsData 不是和属性有关,他用在全局扩展时进行传递数据。扩展标签已经做好了,这时我们要在挂载时传递一个数字过去,我们就用到了propsData。我们用propsData三步解决传值:1、在全局扩展里加入props进行接收。propsData:{a:1}2、传递时用propsData进行传递。props:[‘a’]3、用插值的形式写入模板。{{ a }}<!doctype html&...

2018-07-03 09:30:10 764

原创 String 对象方法

var a="abcdc";var b="a+d+c"; 对象作用例子charAt(num)返回在指定位置的字符alert(a.charAt(3));//dcharCodeAt(num)返回指定位置的字符的Unicode编码alert(a.charCodeAt(3));//100fromCharCode()接受一个或多个指定的Unicode值,然后返回一个或多个字符串。alert(String.f...

2018-07-02 23:10:57 161

原创 JS 数组

创建数组var a=new Array(元素1,元素2,元素3,元素4,........)var a=[1,2,3,4];遍历数组的元素1) for 循环(2) while();(3)  for...in 循环将遍历对象的所有可枚举属性。//for in更适合遍历对象,不要使用for in遍历数组for(var i in a){document.write(a[i]+"|");}  //1|2|3...

2018-07-02 23:04:43 184

原创 Js获取当前日期时间及其它操作

创建时间对象var now= new Date(); 常用方法: JS获取当前时间var myDate = new Date();myDate.getYear();        //获取当前年份(2位)myDate.getFullYear();    //获取完整的年份(4位,1970-????)myDate.getMonth();       //获取当前月份(0-11,0代表1月)myDat...

2018-07-02 22:48:51 112

原创 vue 组件 component

全局化注册组件Vue.component('panda',{ template:`<div style="color:red;">全局化注册的jspang标签</div>` })局部注册组件局部注册组件和全局注册组件是向对应的,局部注册的组件只能在组件注册的作用域里进行使用,其他作用域使用无效。 <script type="te...

2018-07-02 22:35:33 302

原创 Template 制作模版

一、直接写在选项里的模板直接在构造器里的template选项后边编写。这种写法比较直观,但是如果模板html代码太多,不建议这么写。javascript代码:123456789 var app=new Vue({     el:'#app',     data:{         message:'hello Vue!'      },     template:`        <h1 s...

2018-07-02 21:14:00 287

原创 Vue的生命周期(钩子函数)

<script type="text/javascript"> var app=new Vue({ el:'#app', data:{ message:1 }, methods:{ jia:functio...

2018-07-02 20:54:12 275

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除