自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 JavaScript 错误处理指南

JavaScript 中的错误是什么JavaScript中的错误是一个对象。要在 JS 创建一个错误,可以使用 Error 对象,如下所示:const err = new Error('霍霍,好像哪里出问题了!')也可以省略new关键字:const err = Error('霍霍,好像哪里出问题了!')创建错误对象有三个属性:message:带有错误消息的字符串name:错误的类型stack:函数执行的堆栈跟踪JavaScript中的许多类型的错误JavaScript 中有很

2020-10-16 19:42:42 97

原创 Sass布局

一、什么是SASSSASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计者的时间,使得CSS的开发,变得简单和可维护。特点:不能直接在页面中解析,需要使用ruby预先翻译成css文件,而Less可以在线动态翻译。Sass功能更加强大,拥有流控语句等Less不具备的功能完全兼容 CSS3,在 CSS 语言基础上添加了扩展功能,比如变量、嵌套 (nesting)、混合 (mixin)功能:它是更稳定,强大,与CSS的版本兼容。它是超集的CSS和基于JavaScript。它被

2020-10-16 18:52:01 21

原创 VueX基本使用总结

一、简介Vuex是一种状态管理模式,它能够集中式存储管理所有组件的状态,并用相应的规则约束状态以一种可预测的方式发生变化。简而言之,Vuex采用类似全局对象的形式来管理所有组件的公用数据,如果想修改它里面的数据,得按照Vuex提供的方式来修改。使用场景:购物车的数据共享,登入注册二、优点Vuex的状态存储是响应式的:当Vuex的状态发生改变,所有使用它的组件会自动更新相对应的数据。不能直接修改Vuex的状态:全局对象变量可以直接修改,但Vuex无法直接修改。必须使用提交mutation的方

2020-10-14 21:47:56 10

原创 Vue路由基本使用的总结

介绍路由:控制组件之间的跳转,不会实现请求、不用页面刷新,直接跳转-切换组件安装本地环境安装路由插件vue-router: cnpm install vue-router --save-dev没有安装淘宝镜像的可以将 cnpm 替换成 npm配置两种配置方法:1.在main.js中2.在src/router文件夹下的index.js中这里只说在src/router/index.js中的引入:import Vue from 'vue'import Router from 'v

2020-10-14 20:43:36 10

原创 Axios网络请求

一、axiosAxios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中, 也是vue官方推荐使用的http库;封装axios,一方面为了以后维护方便,另一方面也可以对请求进行自定义处理安装npm install axios; // 安装axios复制代码二、axios的封装在vue项目中,和后台交互获取数据这块,我们通常使用的是axios库,它是基于promise的http库,可运行在浏览器端和node.js中。他有很多优秀的特性,例如拦截请求和响应、取消请

2020-10-14 20:02:03 27

原创 Vue-cli脚手架构建项目

一、技术准备1、 Vue.js基础知识 Vue.js特点就是入门简单,api 简洁一致,文档清晰。对于了解Html,CSS,JavaScript花几个小时看一遍,就能掌握基础的东西。 可参考http://www.runoob.com/vue2/vue-tutorial.html。2、 ES6的模块化加载 有ES6中,可以不使用SeaJS或者RequireJS,而直接使用import和export在浏览器中导入和导出各个模块了, 具体使用参考http://www.cnblogs.com/diligence

2020-10-11 23:02:49 13 1

原创 Vue.js基础总结

1.认识VuejsVue是一个渐进式框架, 什么是渐进式的呢?声明式渲染→组件系统→客户端路由→集中式状态管理→项目构建渐进式意味着你可以将Vue作为你应用的一部分嵌入其中,带来更丰富的交互体验。Vue有很多特点和Web开发中常见的高级功能解耦视图和数据可复用的组件前端路由技术状态管理虚拟DOM2.Vue初体验3.Vue中的MVVMView层视图层前端开发中, 通常就是DOM层主要的作用是给用户展示各种信息Model层数据层数据可能是我们固定的死数据, 更多的是来自我们的服务器, 从

2020-10-09 23:56:39 749

原创 ES6习列3--promise和class类

1.回调地域问题异步编程在JavaScript中非常重要,过多的异步编程也带了回调嵌套的问题。解决方法(1)拆解function:将各步拆解为单个的function(2)事件发布/监听模式一方面,监听某一事件,当事件发生时,进行相应回调操作;另一方面,当某些操作完成后,通过发布事件触发回调,这样就可以将原本捆绑在一起的代码解耦。(3)PromisereadFile('./sample.txt').then(content => { let keyword = content.su

2020-10-07 23:02:57 36

原创 ES6系列2--语法扩展

1.剩余参数(…rest)作用:将一个不定数量的参数表示为一个数组(旨在取代arguments)首先,我们看看argumentsfunction show(){ return arguments;}console.log(show(1,2,3,4));// [Arguments] { '0': 1, '1': 2, '2': 3, '3': 4 }arguments是一个类数组对象,表示输入的所有实参,但没法直接使用Array的方法。console.log(show(1,2,

2020-10-06 22:56:38 23

原创 ES6系列1--基础入门

1. 块级作用域ES5 只有全局作用域和函数作用域(例如,我们必须将代码包在函数内来限制作用域),这导致很多问题:情况1:内层变量覆盖外层变量情况2:变量泄露,成为全局变量ES6 提供 let 和 const 来代替 var 声明变量,新的声明方式支持用大括号表示的块级作用域,这会带来一些好处:**1.不再需要立即执行的函数表达式(IIFE) 在 ES5 中,我们需要构造一个立即执行的函数表达式去保证我们不污染全局作用域。**在 ES6中, 我们可以使用更简单的大括号({}),然后使用 cons

2020-10-06 22:10:45 13

原创 移动端开发案例-京东移动端首页

1.移动端技术选型方案:单独制作移动页面方案布局:流式布局2.搭建相关文件夹结构其中index.html是京东首页,index.css是自己写的样式,另外一个css初始化文件可以从http://necolas.github.io/normalize.css//下载保存到相应位置.images主要是放置背景图,upload主要是放置一些产品图片3.设置视口标签以及引入初始化样式4.整体html结构5.分析页面布局移动端的布局和网页端的布局基本一样,也是大盒子套小盒子,综合应用流式、定位

2020-09-26 23:10:32 78

原创 关于背景透明,文字不透明的兼容处理

我们在做PC端项目的时候,常常会碰到透明背景和透明图片的的需求,但是透明度常常有会发生很多问题,特别是背景透明内容不透明,想要兼容所有浏览器实现起来就比较麻烦。如何实现背景透明,文字不透明,兼容所有浏览器?其实平时说的调整透明度,其实是在样式中调整不透明度,如下图:实现透明的css样式通常有以下3种方式,以下是不透明度都为50%的写法:css3的opacity:value,value 的取值从 0 到 1,如opacity: 0.5css3的rgba(red, green, blue, alp

2020-09-25 21:32:23 80

原创 如何解决span元素中间的空格间隙

初学html、css的同学是不是遇到过这样一个问题?一对好朋友(两个span元素)之间总是存在间隙。就像下图那样:一一对不快乐的 span,因为他们中间有了间隙当我们给span元素添加了内容时,两个相邻的span元素的文字之间有一个间隙,这个间隙其实是一个空格。那这个空格时怎么来的呢?首先先来看看我们平时的代码书写习惯吧<body> <p> <span>舒克</span> <span>贝塔</span> &l

2020-09-25 21:16:41 123

原创 小竖线的三种实现方法

我们平时在写网页的时候经常看到两个超链接中间会存在一个小竖线,如下图:实现方法第一种:边框实现法html结构<div> <a href="#">首页</a> <a href="#" class="line">首页</a></div>css样式<style>* { margin: 0; padding: 0;}div { height: 40px; background: #999;}

2020-09-25 20:58:30 76

原创 解决img标签下面的小空隙

很多初学小伙伴在写页面的时候碰到过一个问题,当我们用一个div直接包裹img,img的下方会出现3px间距,如图<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> <sty

2020-09-25 20:45:25 17

原创 前端基础-HTTP和HTTPS

1.HTTP和HTTPS的基本概念HTTP:是hypertext transfer protocol(超文本传输协议)的简写,它是TCP/IP协议的一个应用层协议,用于定义WEB浏览器与WEB服务器之间交换数据的过程。HTTPS:是以安全为目标的HTTP通道,简单讲是HTTP的安全版,即HTTP下加入SSL层,HTTPS的安全基础是SSL,因此加密的详细内容就需要SSL2.HTTPS VS HTTPhttps更安全HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议,要

2020-09-25 18:54:35 72

原创 基础网页布局练习1-博文尚美

1.项目介绍博文尚美是一个设计网站, 此项目由html + css 布局完成页面,对前端基础知识的入门及掌握有非常好的提升效果,对html和css的使用及布局的体验能够建立起强大的信心。2.项目相关知识点HTML + CSS盒子模型 + 浮动 + 定位部分H5标签和C3属性3.项目演示图4.页面布局整体思路(1).确定网页结构结构分为5个部分:头部、服务范围、客户案例、最新资讯、尾部(2).确定页面的版心和通栏通栏:自适应浏览器宽度版心:给一个固定宽度,不需要给高度,它可

2020-09-24 00:32:33 447

原创 JS学习系列4-Ajax

Ajax1.概念AJAX 即 “Asynchronous Javascript And XML”,是指一种创建交互式网页应用的网页开发技术。AJAX = 异步 JavaScript 和 XML(标准通用标记语言的子集)。AJAX不是一种新的编程语言,是一种用于创建更好更快以及交互性更强的Web应用程序的技术,能够实现无刷新更新数据从而提高了用户体验。**通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。**而传统的

2020-09-22 23:51:47 974

原创 前端开发工程师必会的网页布局方法

1.静态布局(static)1.1布局特点不管浏览器尺寸具体是多少,网页布局始终按照最初写代码时的布局来显示。常规的pc的网站都是静态(定宽度)布局的,也就是设置了min-width,这样的话,如果小于这个宽度就会出现滚动条,如果大于这个宽度则内容居中外加背景,这种设计常见于pc端。1.2.设计方法PC设备:设计一个居中布局,一般具有固定的宽度,当浏览器窗口缩小时,页面内容会被遮挡,呈现横竖向滚动条。移动设备:另外建立移动网站,单独设计一个布局,使用不同的域名如wap.或m.1.3 在移动端开发

2020-09-21 09:04:30 97

原创 JS中的闭包、作用域

在JavaScript中闭包无所不在,你只是必须认出它并接纳它。scope及变量查询作用域,也就是我们常说的词法作用域,说简单点就是你的程序存放变量、变量值和函数的地方。块级作用域如果你接触过块级作用域,那么你应该非常熟悉块级作用域。简单说来就是,花括号{}括起来的代码共享一块作用域,里面的变量都对内或者内部级联的块级作用域可见。基于函数的作用域在JavaScript中,作用域是基于函数来界定的。也就是说属于一个函数内部的代码,函数内部以及内部嵌套的代码都可以访问函数的变量。...

2020-09-19 20:55:01 22

原创 理解JS中的原型和原型链

1.原型JavaScript 是一门面向对象的语言。殊不知,JavaScript的世界中的对象,追根溯源来自于一个 null。在 ECMAScript 5 中,创建对象,一般有三种方法:对象直接量:var point = {x:0 , y:0} ;new 和构造函数:var a = new Array() ;Object.create():var o1 = Object.create({x:1 , y:2})1.1概念绝大部分 JavaScript 对象(null 除外)都和另一个对象相关联,即

2020-09-19 19:36:47 21

原创 JS学习系列3-DOM与BOM

DOM和BOMJavaScript分为 ECMAScript,DOM,BOM。核心(ECMAScript):描述了JS的语法和基本对象。文档对象模型 (DOM):是指文档对象模型,通过它,可以访问HTML文档的所有元素 , 它是处理网页内容的方法和接口。浏览器对象模型(BOM):是指浏览器对象模型,它使 JavaScript 有能力与浏览器进行“对话”。它是浏览器交互的方法和接口。BOM和DOM的结构关系示意图:1.BOM浏览器对象模型1.1 Window对象Window对象是客户端Jav

2020-09-19 07:33:18 23

原创 JS学习系列2-Javascript流程控制语句与数组

1.Javascript流程控制语句1.1 概念JavaScript中的语句是从上到下一层一层执行的,通过流程控制语句可以控制程序执行的流程,使程序可以根据一定的条件来选择执行。主要分为顺序执行、 选择执行、 循环执行这三种1.2 条件语句如果说JavaScript解释器是按照代码的"路径"执行的话 那条件语句就是这条路上的分叉点 代码执行到这里时必须选择其中一条路径继续执行JavaScript提供了两种条件语句:if…else语句和switch…case语句1.2.1 if else语句当

2020-09-18 09:02:22 30

原创 Javascript对象 -03对象方法和this

对象方法和this对象方法作为对象属性的方法称为“对象方法”,如下面 user 对象的 say 方法:let user = {};let say = function(){console.log("hello!")};user.say = say; // 赋值到对象上user.say(); // "hello!"也可以使用更加简洁的方法:let user = { say: function(){} // 简写为 say (){console.log("hello!")

2020-09-18 00:31:41 10

原创 Javascript对象 -02对象拷贝

对象拷贝1. 赋值操作首先回顾下基本数据类型和引用数据类型:基本类型概念:基本类型值在内存中占据固定大小,保存在栈内存中(不包含闭包中的变量)。常见包括:undefined,null,Boolean,String,Number,Symbol引用类型概念:引用类型的值是对象,保存在堆内存中。而栈内存存储的是对象的变量标识符以及对象在堆内存中的存储地址(引用),引用数据类型在栈中存储了指针,该指针指向堆中该实体的起始地址。当解释器寻找引用值时,会首先检索其在栈中的地址,取得地址后从堆中获得实体。常

2020-09-18 00:19:01 10

原创 Javascript对象-01对象

Javascript对象总结JavaScript 有八种数据额类型,有七种原始类型,它们值只包含一种类型(字符串,数字或其他),而对象是用来「保存键值对和更复杂实体。」我们可以通过使用带有可选「属性列表」的花括号 {…} 来创建对象,一个属性就是一个键值对 {“key” : “value”} ,其中键( key )是一个字符串(或称属性名),值( value )可以是任何类型。创建对象我们可以使用 2 种方式来创建一个新对象:A. 通过“构造函数”创建let user = new Object(

2020-09-17 23:53:05 19

原创 JS学习系列1-Javascript基础语法总结

标题1.Javascript基础语法总结1.JS基本语法使用:JS 有3种书写位置,分别为行内、内嵌和外部。行内式:内嵌:外部:推荐使用外部方式使用JS,将 JS代码独立到 HTML 页面之外,既美观,也方便文件级别的复用.2.JS变量声明与提升的机理函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体的最顶部。var声明的提升:A.var不论在哪里声明的,都会被当成在当前作用域顶部声明的。B.变量提升是在预编译的过程中发生的,赋值不确定C.被声明的变量还是在原来的地方,真正

2020-09-16 01:14:09 39

空空如也

空空如也

空空如也

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

TA关注的人 TA的粉丝

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