自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

兔子juan的博客

前端入门射手女

  • 博客(82)
  • 资源 (2)
  • 收藏
  • 关注

原创 搞定所有的跨域请求问题: jsonp & CORS

网上各种跨域教程,各种实践,各种问答,除了简单的 jsonp 以外,很多说 CORS 的都是行不通的,老是缺那么一两个关键的配置。本文解决跨域中的 get、post、data、cookie 等这些问题。本文只会说 get 请求和 post 请求,读者请把 post 请求理解成除 get 请求外的所有其他请求方式。JSONP前端 jQuery 写法 后端 SpringMVC 配置 ...

2018-08-15 16:50:03 1260

原创 Javascript中的shift() 、unshift() 和 pop()、push()区别

1.shift()函数定义:该函数从从数组中删除第一项,并返回该删除项。var fruits = ["Banana", "Orange", "Apple", "Mango"];fruits.shift() //Bananaconsole.log(fruits); //Orange,Apple,Mango注:该方法会改变数组的长度。2.unshift()函数...

2018-08-14 16:11:07 9356

转载 es6 javascript的Iterator 和 for...of 循环

1 Iterator( 遍历器) 的概念JavaScript 原有的表示“ 集合” 的数据结构, 主要是数组( Array) 和对象( Object), ES6 又添加了 Map 和 Set。 这样就有了四种数据集合, 用户还可以组合使用它们, 定义自己的数据结构, 比如数...

2018-08-14 14:03:55 176

转载 面试题之一 —— 手写一个promise

Promise对象代表一个异步操作,有三种状态:pending(进行中)、fulfilled(已成功)和rejected(已失败)。一旦成功就不允许失败,一旦失败就不允许成功。function Promise(excutor) { let self = this self.status = 'pending'...

2018-08-13 16:34:02 8423

原创 面试题 —— Ajax的基本原理总结

前两天面试的时候,面试官问我,你掌握的技能是Ajax,那你给我讲一下它的基本原理吧! 妈呀,瞬间脑子空白。当时在门口背了好久的网络知识点,一时竟然说不吃话,只记得什么异步通信,同步数据,面试官的笑让我不寒而栗…………今天整体的整理一遍Ajax的知识点吧。 ...

2018-08-13 11:11:47 29747 3

转载 快速创建一个vue项目

身为入行未深的小白前端,不断的学习是我们不可丢失的习惯。前端流行的框架也是层出不穷,vue在众多框架中脱颖而出。今天花了两个小时的时间自己走了一边创建vue项目的流程,跟你们分享。1:打开cmd命令行,首先安装node步骤:https://nodejs.org/en/dow...

2018-08-12 10:47:29 714

转载 JavaScript原生代码实现楼层跳跃

<!doctype html><html lang=“en”><head> <meta charset=“UTF-8”> <meta name=“viewport” content=“width=device-width...

2018-08-08 22:12:58 809

转载 总结:常见正则表达式(记住)

1. 校验基本日期格式var reg1 = /^\d{4}(\-|\/|\.)\d{1,2}\1\d{1,2}$/</span>;</div></div></li><li><div class="hljs...

2018-08-03 17:23:17 643

转载 八种方式实现跨域请求

前端开发中我们经常会遇到跨域请求的情况,处理跨域请求方式很多,特整理如下:浏览器的同源策略​ 提到跨域不能不先说一下”同源策略”。 同源策略是客户端脚本(尤其是Javascript)的重要的安全度量标准。​ 何为同源?只有当协议、端口、和域名都相同的页面,则两个页面具有相同的源。只要网站的 ...

2018-08-02 16:26:38 419

原创 px和em的区别

px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。em是相对长度单位。相对于当前对象内文本的字体尺寸,多理解父级设定font-size的尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。为了简化f...

2018-08-02 12:07:55 10471

原创 项目:Vue.js高仿饿了吗外卖APP(二)

【vue】饿了吗项目 – goods商品列表开发(PS:结合自己这几天看的,以及前人给出的经验,借鉴他人的博客,总结出下面的内容)1.flex 属性是 flex-grow、flex-shrink 和 flex-basis 属性的简写属性。flex-grow 一个数字,规定项目将相对于其他灵活的项目进行扩展的量。flex-shrink 一个数字,规定项目将相对于其他灵活的项目...

2018-08-02 12:02:35 3242

转载 vue饿了吗学习笔记 – webpack版本问题

问题webpack版本最近在学习慕课网的vue.js高仿饿了么外卖APP,在项目准备时就遇到了webpack版本问题。视频中使用的webpack是1.12.2,而现在的webpack 版本已经到了3.6,原先的代码已经不适用了。言归正传,当我们想给我们的mock data设置一个接口请求,原版本是配置在dev-s...

2018-08-02 10:18:15 657

原创 如何获取UA?

通过JS获取浏览器UA(User Agent,用户代理)<script>function whatBrowser() {//获取完整的浏览器名称document.Browser.Name.value=navigator.appName; //获取浏览器的版本,一般不与实际的浏览器版本对应document.Browser.Version.value=navigator.ap...

2018-08-01 21:03:04 6119

原创 终于弄懂了事件冒泡和事件捕获!

总结了两个人的博客,写了这篇:总算是搞清楚事件捕获和事件冒泡了!参考资料浅谈事件冒泡与事件捕获 理解事件捕获和事件冒泡1、事件捕获 捕获型事件(event capturing):事件从最不精确的对象(document 对象)开始触发,然后到最精确(也可以在窗口级别捕获事件,不过必须由开发人员特别指定)2、事件...

2018-08-01 20:30:47 56388 10

转载 Vue高仿饿了吗学习笔记

VUE高仿饿了么app本项目github地址:https://github.com/motysla/eleme.gitVUE 搭建简介刚学习了VUE高仿饿了么app课,记录课的要点,巩固知识。VUE 优势Vue.js 是一个用于创建 web 交互界面的。其特点是简洁 HTML 模板...

2018-08-01 11:28:38 1911

转载 js中arguments到底是什么?

类数组对象:arguments总所周知,js是一门相当灵活的语言。当我们在js中在调用一个函数的时候,我们经常会给这个函数传递一些参数,js把传入到这个函数的全部参数存储在一个叫做arguments的东西里面,那么这到底是什么东西?在js中万物皆对象,甚至数组字符串函数都是对象。所以这个叫做arguments的东西...

2018-07-31 19:41:43 309

转载 javascript 中函数调用方法:apply() 和 call()

每个函数都包含两根非继承而来的方法:apply()和call()。这两个方法的用途都是在特定的作用域中调用函数,实际上等于设置函数体内this对象的值。 首先,apply()方法接收两个参数:一个是在其中运行函数的作用域,另一个是参数数组。其中第二个参数可以是Array的实例,也可以是arguments对象。例如:...

2018-07-31 18:12:48 1176 1

原创 数据结构常考题 —— 八种经典内部排序算法

经典排序算法我们经典的排序有内部排序和外部排序,内部排序是数据记录在内存中进行排序,而外部排序是因排序的数据很大,一次不能容纳全部的排序记录,在排序过程中需要访问外存。 算法复杂度如下图: 下面我们一一来总结这每一种算法:一、插入排序插入排序的基本方法是:每步将一个待排序的记录,按其排序码大小,插到前面已经排序的文件中的适当位置,直到全部插入完为止。1.直接插入排序 ...

2018-07-31 11:02:46 5745

原创 POST和GET区别 -- 面试重点之一

这是面试经常问到的一个问题之一,不论你是前端、后台、网络安全工程师,还是各种和网络浏览器打交道的职业,或多或少的都应该知道这个知识点,毕竟也是很多专业的本科必修课之一!POST和GET区别:表单提交中get和post方式的区别有5点1.get是从服务器上获取数据,post是向服务器传送数据。2.get是把参数数据队列加到提交表单的ACTION属性所指的URL中,值和表单内各个字...

2018-07-30 11:38:17 5393 2

原创 vue高仿饿了么课程项目--布局篇学习笔记

结合他人经验以及自己学习过程中遇到的问题,将知识点整理如下。这篇是布局篇(采用stylus)flex布局如果一个布局需要左边是固定长度,右边是自适应宽度,随拉大而大,缩小而小,则可以使用flex布局。移动端很适合。.wrapper display: flex w...

2018-07-28 14:25:13 615

原创 javascript中一些相对位置

scrollHeight: 获取对象的滚动高度。 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离scrollWidth:获取对象的滚动宽度offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度offsetLeft:...

2018-07-27 22:43:43 913

转载 轮播图的实现原理

一、实现轮播图最主要的就是定时器 (setInterval 函数和 clearInterval 函数),他们分别是定时和清除定时。二 、html代码如下:<div class="warp"> <div class="mod-tab"> <ul id="list"> <li class="

2018-07-27 22:11:46 4755

转载 js实现轮播图原理及示例(转)

网上有很多的例子介绍,在这里我所做的无缝滚动就是 通过改变元素的left值让图片呈现左右滚动的效果。 我们首先看一下 div+css 的结构样式: div+css代码<!DOCTYPE html><html> <head>

2018-07-27 21:25:44 12769

转载 CSS预处理器 -- stylus 、sass、less

在写CSS的时候我们会发现,为了兼容浏览器等原因,我们往往需要写很多冗余的代码,CSS预处理器就是为了解决CSS的这些问题,简化CSS代码的编写。目前最主流的CSS预处理器是LESS、SASS和Stylus,主要从以下几个方面进行讨论:基本语法变量 嵌套 混入(mixin) 继承 函数 @import 运算符 逻辑控制 基本语法LESS的基本语法...

2018-07-26 15:24:51 504

原创 font-size:0 —— 解决inline、inline-block元素间的空白间隙

很多时候我们都会遇到这么个问题:display为inline和inline-block的时候,当你代码换行后,会在网页上产生一个空格,这个空格有可能会导致最后一个会掉下来。避免方法可以不换行,只不过这种方法很不好,所以一般都是设置 font-size:0如图: 一般我们是这样的: 内容和左图是挨着的,给人的呈现感很好,这里的font-size:0; 但是当font-size为负...

2018-07-26 10:36:25 1257

原创 项目:Vue.js高仿饿了吗外卖APP(一)

使用Vue.js作为项目的技术栈!这是目前最火的MVVM框架(之一),轻量、简洁、高效、数据驱动、组件化的优点,被大家称为“简单却不失优雅,小巧而不乏大匠”! 开发此项目需要的前置知识: HTML CSS JavaScript 还需要es6(目前很重要)...

2018-07-24 21:26:28 7630

转载 阿里笔试题目 -- 实现mergePromise函数

实现mergePromise函数,把传进去的数组顺序先后执行,并且把返回的数据先后放到数组data中.//实现mergePromise函数,把传进去的数组顺序先后执行,//并且把返回的数据先后放到数组data中const timeout = ms => new Promise((resolve, reject) => { setTimeout(() => {...

2018-07-23 17:02:57 722

原创 笔试题目 -- css3弹性盒子flex实现三栏布局

刚开始学习前端的时候,没有注意到这里,3-4月份找实习的时候也见过这个题目,在网上找到答案就敲上去了,没留意。 但是前提做CVTE笔试题目时,又发现的这道题目,决定好好看一下,记下来:题目: 请用flex实现三栏布局,高度已知,左右栏宽度300px,中间自适应。弹性盒子本身就是并排的,我们设置宽度即可。 用一个容器container包裹三栏,设置comtainer容器的d...

2018-07-23 16:46:27 3951

原创 浅谈CSS3中Flex布局

一、简要介绍  css3最喜欢的新属性之一便是flex布局属性,用六个字概括便是简单、方便、快速。  flex( flexible box:弹性布局盒模型),W3C提出了一种新的方案—-Flex布局,可以简便、完整、响应式地实现各种页面布局。主要思想是给予容器控制内部元素高度和宽度的能力。目前已得到以下浏览器支持: 其中在webkit内核的浏览器(Safari、Chrome等浏览器...

2018-07-23 16:17:46 303

原创 webstorm设置babel,使用es6

网上有很多关于如何设置babel的。我学习着设置,但总差那么几步,没能满足我的需求。我使用的是webStorm2017.1版本。babel安装准备使用webStorm自带的filewatcher中的babel自动编译前,需要安装一些babel库全局安装babel-clinpm install -g babel-cli 网上有些教程让全局安装b...

2018-07-20 10:37:53 177

转载 web前端面试题整理

前端和计算机相关知识1. 你能描述一下渐进增强和优雅降级之间的不同吗?定义: 优雅降级(graceful degradation): 一开始就构建站点的完整功能,然后针对浏览器测试和修复 渐进增强(progressive enhancement): 一开始只构建站点的最少特性,然后不断针对各浏览器追加功能。 都关注于同一网站在不同设备里不同浏览器下的表现程度区别: “优雅降级...

2018-07-18 16:31:01 291

原创 前端——网络方向面经题目总结

面试中网络方面的知识被问到的概率很大,尤其是互联网公司,要熟悉osi七层模型,其中TCP/IP方面的知识尤其重要。(如果自己平时有Socket编程的经验对面试也是很有帮助的。网络方面有空可以看看TCP/IP详解卷一和UNIX网络编程。)几乎技术岗的面试可能或多或少的都会问到网络相关的概念,毕竟也是计算机专业的基础知识,这里我总结了一些网上的面经以及自己看到的一些问题:0、TCP/IP 基础...

2018-07-18 16:26:18 1280

原创 Vue.js入门学习(七)组件

组件本节介绍 Vue.js 组件的使用。组件是 Vue.js 最强大的功能之一,使用组件可以扩展 HTML 元素,封装可重用的代码。使用组件注册之前说过,我们可以用 Vue.extend() 创建一个组件构造器:var MyComponent = Vue.extend({ // 选项...})要把这个构造器用作组件,需要用 Vue.component(tag, constructor) 注册...

2018-07-14 11:23:51 232

原创 Vue.js入门学习(六)过渡

过渡通过 Vue.js 的过渡系统,可以在元素从 DOM 中插入或移除时自动应用过渡效果。Vue.js 会在适当的时机为你触发 CSS 过渡或动画,你也可以提供相应的 JavaScript 钩子函数在过渡过程中执行自定义的 DOM 操作。为了应用过渡效果,需要在目标元素上使用 transition 特性:<div v-if="show" transition="my-transition"&...

2018-07-12 21:06:02 182

原创 Vue.js入门学习(五)方法与事件处理器、表单控件绑定

方法与事件处理器方法处理器可以用 v-on(简写@) 指令监听 DOM 事件:<div id="example"> <button @click="greet">Greet</button></div>我们绑定了一个单击事件处理器到一个方法 greet。var vm = new Vue({ el: '#example', data: {...

2018-07-11 20:55:14 240

原创 Vue.js入门学习(四)条件/列表渲染

条件渲染v-if:在字符串模板中,我们需要写这样一个条件块:{{#if ok}} <h1>Yes</h1>{{/if}}但是在Vue.js中,我们使用 v-if 就可以实现上述同样的功能:<h1 v-if="ok">Yes</h1>也可以用 v-else 添加一个 "else" 块:<h1 v-if="ok"&

2018-07-11 20:21:18 333

原创 Vue.js入门学习(三) Class与Style绑定

Class 与 Style 绑定数据绑定一个常见需求是操作元素的 class 列表和它的内联样式。因为它们都是属性,我们可以用 v-bind 处理它们:我们只需要计算出表达式最终的字符串。不过,字符串拼接麻烦又易错。因此,在v-bind 用于 class 和 style 时,Vue.js 专门增强了它。表达式的结果类型除了字符串之外,还可以是对象或数组。绑定 HTML Class尽管可以用 Mus...

2018-07-11 11:35:55 191

原创 Vue.js入门学习(二)实例、数据绑定、计算属性

从这一节开始,就开始正式的细节性、系统性的学习Vue.js!Vue实例构造器每个 Vue.js 应用的起步都是通过构造函数 Vue 创建一个 Vue 的根实例:<textarea readonly="readonly" name="code" class="javascript">var vm = new Vue({ // 选项})</textarea>一个 Vu...

2018-07-11 11:22:09 454

原创 Vue.js 入门学习(一)

此课程是我跟随慕课网学习的入门学习笔记!欢迎大家指导与学习Vuejs官方网站:https://cn.vuejs.org/

2018-07-10 22:50:39 276

原创 多益网络前端面经

2018年7月5日:今天开始多益网络提前批面试了,由于生病整个状态也是十分的不好,当然结果是挂了,但是作为第一个面试经历,还是想要将它记录下来,自己巩固,顺便也给大家一个参考。首先,自我介绍,项目介绍,谈谈给你印象最深刻的一个项目中自己所遇到的难题,以及最终是如何解决的,找一两个点好好谈一谈?然后开始问问题(对于才学前端没多久的我来说有点难):1,请谈谈POST和GET的区别是什么两种 HTTP ...

2018-07-09 21:41:55 4951

三天仿写京东页面

使用JS+HTML+CSS实现一个网页,包含基本布局、样式和基础特效。 1、使用HTML、CSS构建页面; 2、使用JavaScript来实现页面效果; 3、实现轮播图,楼层跳转等页面效果;

2018-07-09

空空如也

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

TA关注的人

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