- 博客(36)
- 收藏
- 关注
RSS订阅转载 javascript中this的用法
this是 JavaScript 语言的一个关键字。1.它总是指向函数的直接调用者。2.如果有new关键字，this则指向new出来的那个对象。3.在事件中，this指向触发这个事件的对象。第一种：函数调用全局性调用，this指向全局对象var x=1;function a(){ console.log(this.x);}a(); //1第二种 ...
2018-09-04 18:31:24
262
原创 前端模块化以及AMD和CMD
1.什么是前端模块化？前端模块化就是将具有完整功能的代码整合起来形成一个单独的功能组件，在需要的地方引入这个组件。一个模块就是实现特定功能的文件，有了模块，我们就可以更方便地使用别人的代码，想要什么功能，就加载什么模块。2.模块化开发的好处？一个模块一个分支，不会引发代码冲突。在模块中增加或修改功能，只会影响当前模块，不会影响整个应用。模块化开发大大提高开发效率。3.模...
2018-09-04 15:45:55
364
原创 vue参数传递
第一种方法： 1.在路由中设置name值来传递，此时name的值为HelloWorld 2.我们可以在当前组件中获取name的值：{{$route.name}} 例子中的当前组件就是HelloWorld.vue 3.最后就可以在页面上得到name的值第二种方法： 1. 第一...
2018-04-23 20:17:00
441
原创 vue通过URL传递参数
用参数前加：来传递 1**.绑定参数**：在router>index.js来配置路由 比如说我们传递两个值newId和newTitle(配置文件里以:冒号的形式传递参数，这就是对参数的绑定). 2**传递参数的值**：在APP.vue中设置——此时newId的值为12/newTitle的值如图3.获取参数值：首先我们得在components下面建一个params.vue组件：参数的获取是用{{
2018-04-23 19:53:43
22886
原创 vue-cli文件用途
vue-cli是vue的一个脚手架工具，主要作用：目录结构、本地调试、代码部署、热加载、单元测试当vue-cli安装完成之后，你的项目中会出现如下的目录
2018-04-23 14:57:29
1284
原创 webpack（一）
1.为什么会出现webpack？前端页面越来越复杂，随着SPA技术的流行，JS越来越复杂。并且会需要一大堆依赖包，并且还有SCSS,LESS等扩展所以需要webpack进行打包管理。2.webpack的作用： 【1】.可以将多个JS打包成一个文件，减少服务器压力和下载带宽。 【2】.将其他扩展性语言转换成Js，以便于浏览器解析。 【3】.项目优化，提升性能。3.明确两个重要概念： （
2018-04-21 21:25:25
197
原创 Vue组件之间的三种数据传递方式
Vue组件之间有三种数据传递方式：Vue 的组件作用域都是孤立的，不允许在子组件的模板内直接引用父组件的数据。必须使用特定的方法才能实现组件之间的数据传递。1.props:子组件的模板内并不能直接使用父组件的数据，所以子组件需要用props选项来获取父组件的数据。1.动态语法：用v-bind将动态props绑定到父组件的数据，父组件的数据发生改变，子组件也会随之改变<div id="app"...
2018-04-15 19:38:53
6287
原创 清晰了解MVC/MVP/MVVM三种模式
首先先来了解这三种模式的出现：MVC, MVP和MVVM都是用来解决界面呈现和逻辑代码分离而出现的模式。1.MVC——model view controllermvc是应用最广泛的软件架构之一，它的出现主要是基于分层的目的，让彼此的职责分隔开。他们之间的通信方式如下图： 图一.MVC通信方式一解析图一：view一般都是通过co...
2018-04-13 10:49:56
571
原创 常见协议
常见协议默认端口协议作用FTP21文件的上传/下载SSH22远程登录DNS53域名解析TELNET23远程登录HTTP80超文本传输协议HTTPS443加密传输的HTTPSMTP 25邮件传输POP3109 邮件接收NETBIOS137,138,139网上邻居传输文件TCP/IP协议族: 应用层 ： HTTPS FTP TELNET/SSH/VNC DNS POP3 SMTP传...
2018-04-13 09:42:13
192
原创 一个WEB页面的访问过程
在了解web的访问过程之前，我们需要了解几个简单的概念：DNS工作原理:每个IP地址都可以有一个主机名，主机名由一个或多个字符串组成，字符串之间用小数点隔开。有了主机名，就不要死记硬背每台IP设备的IP地址，只要记住相对直观有意义的主机名就行了。这就是DNS协议的功能。，DNS是专门负责将域名转换成对应的IP地址。主机名到IP地址的映射有两种： (1).静态映射：每台设备上都配置主机...
2018-04-12 23:00:31
2255
原创 TCP三次握手四次挥手
在学习tcp三次握手四次挥手之前首先我们需要了解TCP的报文格式：TCP三次握手：所谓三次握手（Three-Way Handshake）即建立TCP连接，就是指建立一个TCP连接时，需要客户端和服务端总共发送3个包以确认连接的建立。第一次握手：起初两端都处于关闭状态，客户端将标志位SYN置为1（表示这是一个连接请求），随机产生一个值seq=x，并将该数据包发送给Server，客户端进入SYN-SE...
2018-04-12 22:24:59
137
原创 TCP/IP
什么是TCP/IP协议族 TCP/IP协议族是用于因特网的通信协议它定义了电子设备（比如计算机）如何连入因特网，以及数据如何传输的标准。协议的重要性：协议就是计算机之间通过网络实现通信时事先达成的一种“约定”；这种“约定”使那些由不同厂商的设备，不同CPU及不同操作系统组成的计算机之间，只要遵循相同的协议就可以实现通信协议可以分很多种，每一种协议都明确界定了它的行为规范：2台计算机之间必须能...
2018-04-12 18:09:13
306
原创 HTTP知识点总结
HTTP(Hypertext Transfer Protlcol)超文本传输协议，是 万维网上的通信协议（用于web服务器和web客户端之间的双工通信——客户端向服务器发送HTTP请求，服务器会在HTTP响应中返回请求的数据）。web服务器会为所有的HTTP对象数据附加一个名为MIME类型的数据格式标签。例：（普通的ASCLL文本文档由text/plain标记）。URI：统一资源标识符——服务器上...
2018-04-12 16:07:52
216
原创 如何在登录成功后将后台的数据返回到另一个页面
对于一般的Ajax请求来说，它只能将后台返回的数据，加载到当前页面，不可跨页面传值（页面的刷新问题），而项目中经常会用到跨页面传值， 这就需要引入sessionStorage (会话存储)。 sessionStorage适用于在一个当前会话中保存数据，而如果结束当前会话（关闭浏览器），这个数据就会丢失。 对于我的项目而言，我需要将登陆成功后，后台返回给我的用户的个人信息展示到个人资料页面，这里
2018-03-23 11:01:00
9948
1
原创 Web储存和应用缓存
webStorage存储是对HTML4中cookie的改善。 Web Storage又分为localStorage和sessionStorage1.本地存储（localStorage）简单来说就是用于持久化的本地存储，除非主动去删除，否则将会永远存在。 ```//保存数据的方法localStorage.setItem('key','value');或者localStorage.ke
2018-03-23 10:35:26
239
原创 Jquery如何将Ajax从后台获取的数据自动填充到省级下拉菜单
Ajax:Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）,指前后端在不刷新页面的情况下交换数据，更新数据。html代码： <select id="provinceId" onchange="cit()"> //当省级id值改变的时候触发cit()函数 ...
2018-03-22 23:04:16
2439
原创 用JS获取当前时间
Date对象基本属性：获取当前时间：<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style type="text/css"&
2018-03-12 17:51:23
315
原创 js图片悬浮
图片悬浮：代码部分：<div id="top">top</div> //一个块元素css部分：#top{ position: fixed; z-index: 6; width:50px; height:30px; background-color: RGBA(0, 0, 0, .7);; border...
2018-03-09 15:07:02
2036
原创 用原生js实现图片轮播器
轮播器是指图片的循环播放：主要涉及的知识点有：DOM操作，定时器，事件绑定等；如下图：总共有5张图片进行轮播，代码如下：html部分：<div id="container"> <div id="list" style="left:-1200px;"> //left=-1200px表示此刻正在显示第一张图片 ...
2018-03-08 22:15:18
2206
原创 vue---- I Your application is running here:
vue项目搭建npm run dev 出现的问题 出现 I Your application is running here: http://localhost:8083 这句话的意思是你的程序在8083端口运行。 解决办法：目录中config下的index.js修改如下： 将autoOpenBrowser:false ;改为true 意思是是否默认打开浏览器改为是。就好了
2018-03-07 16:08:48
10495
3
原创 去除Eslint验证
在使用vue-cli脚手架构建了webpack项目时，在开发过程中，Eslint验证过于严谨，会导致运行时出现大量错误，可以使用下面方法去除： 1.打开你生成的项目目录中的bulid—>webpack.base.conf.js删除如下代码： `{test: /\.(js|vue)$/,loader: 'eslint-loader',enforce: 'pre',include: [reso
2017-11-12 14:37:30
4714
原创 vue-router路由
vue-router功能了解：vue-router是Vue.js官方的路由插件，适合用于构建单页面应用。vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中，则是路径之间的切换，也就是组件的切换。接下来会根据一个简单的例子来介绍路由实现的效果。 首先你需要了解v-cli(上一篇博
2017-11-12 14:30:32
253
原创 vue-cli端口占用
当运行代码时出现如下图报错： 根据报错信息可以看出是端口被占用。 解决办法：如下图： 在已生成的文件中找到config–>index.js修改port
2017-11-12 11:58:47
1304
原创 搭建vue-cli脚手架
1.搭建环境前期工作准备：1.首先需要安装node.js，可以从官网下载。这里给大家一个Windows64位安装包下载地址：https://nodejs.org/dist/v4.4.3/node-v4.4.3-x64.msi。 下载完成后检查Node.js版本：在命令行输入node –version可以查看到当前版本。2.安装淘宝镜像，因为我们用的npm的服务器是外国，有的时候我们安装“依赖”的时
2017-11-10 21:56:14
278
原创 vue-loader配置
本文以一个例子来完成vue-loader的配置1.首先构建项目目录为： 2.使用Git Bash Here从当前vue-loader文件夹打开，出现如下图：3.如果没有安装淘宝npm镜像，可以先输入npm install -g cnpm –registry=https://registry.npm.taobao.org，接着输入cnpm -v查看是否安装完成，然后就可以使用cnpm来代替npm
2017-11-06 20:09:44
2887
原创 vue子组件获取父组件的内容（props属性）
props属性组件实例的作用域是孤立的。这意味着不能并且不应该在子组件的模板内直接引用父组件的数据。可以使用 props 把数据传给子组件。 想要引用父组件需要：<bbb v-bind:myMsg="msg"></bbb>//子组件将父组件的数据msg绑定到myMsg上bbb:{ props：{ 'myMsg':String //绑定数据的类型 }}完整实例
2017-10-28 10:24:20
13364
原创 Vue动态组件小例子
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script src="js/vue1.0.js"></script></head><body><body><div id="example"> <input type="button" value="
2017-10-28 09:39:03
657
原创 Vue组件-模板
当加入标签比较多时，最好使用模板 <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script src="js/vue1.0.js"></script></head><body><div id="example"> <my-component></my
2017-10-27 17:58:09
500
原创 vue全局组件和局部组件（二）
此方法较为简单，推荐使用全局组件<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script src="js/vue1.0.js"></script></head><body> <div id="example"> <my
2017-10-27 17:32:01
535
原创 vue全局组件和局部组件（一）
全局组件<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script src="js/vue.js"></script></head><body> <div id="example"> <aaa></aaa>
2017-10-27 17:14:14
541
原创 vue简单实例（todolist）
本实例运用vue的一些常用指令如：v-for,v-on,v-model等； v-on:click=”“可简写为@click=“”vue+bootstrap实战注：bootstrap是基于jQuery的，所以引入bootstrap的同时，需引入jQuery。<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <
2017-10-25 16:23:13
678
原创 vue样式（style）和属性（class）绑定的几种基本方法
绑定语法<div v-bind:class=""></div>可简写为：<div :class=""></div>style同上class属性绑定：1.我们可以为 v-bind:class 设置一个对象，从而动态的切换 class<style> .test1{ color:red; } .test2{ background:yellow;
2017-10-24 18:36:06
12801
原创 vue入门（一）
Vue.js 是一套构建用户界面的 渐进式框架，它只聚焦于视图层，。其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，属于MVVM框架。 vue与其他框架的区别 与AngularJS的区别：vue简单易学，简单来说就是一片html代码配合json再new一个Vue，其指令都是以v-XX开头，适合于移动端开发。angularjs上手较难，框架大
2017-10-24 15:41:38
366
原创 position几种定位方式
static：为默认。不能进行z-index 划分层次。relative:相对定位，不脱离文档流，根据自身位置定位，可用z-index 分层。absolute：绝对定位，可脱离文档流，选取其最近的父级元素定位fixed：为固定定位，参照对象为浏览器窗口，能用z-index 划分层次。relative可使用top，left,bottom,right进行定位，根据自身进行定位且不脱离文档流仍保存
2017-09-10 10:47:32
1532
转载 图片悬浮实例
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> *{ margin:0; height:0; } div{ position: ab
2017-09-10 10:02:50
400
原创 onClick和onMouseDown的区别
onClick:是鼠标点击弹起后触发的的事件，即一次完整的鼠标点击过程。 onMouseDown:是指鼠标按下的瞬间触发的。 onMouseUp：在鼠标弹起的时候触发；有特殊情况，不管在哪里按下，只要弹起的时候在你目标区域上，就会触发。 即onClick=onMouseDown+onMouseUp
2017-09-09 17:39:14
1806
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人