ma125120的博客

web前端

9行代码实现复制内容至剪切板

9行代码实现复制内容至剪切板 Demo: https://ma125120.github.io/ma-animate/test/copy.html 本方法主要使用了 Range 对象和HTML5的Selection API,经过测试,本方法在主流浏览器如谷歌浏览器、火狐浏览器、360安全...

2018-04-26 17:59:29

阅读数 271

评论数 0

前端与后台的交互

前端与后台的交互在web应用开发过程中,总免不了前端与后台之间的交互,而二者之间的桥梁通常就是AJAX,那么AJAX到底是怎么工作的呢? 在前后端分离的开发过程中,主要通过参数传递来进行数据的交换。首先,由前端对某个url发起请求,并附加一些参数;然后后台根据前端传递的参数进行数据查询,经过一定的...

2017-07-23 21:28:21

阅读数 5014

评论数 7

简单理解js数据结构

一、堆栈的概念 在计算机领域中,堆栈是两种数据结构。 堆:队列优先,先进先出;由操作系统自动分配释放 ,存放函数的参数值,局部变量的值等。其操作方式类似于数据结构中的栈。 栈:先进后出;动态分配的空间 一般由程序员分配释放, 若程序员不释放,程序结束时可能由OS回收,分配方式倒是类似于链表。...

2018-08-08 00:07:15

阅读数 342

评论数 0

前后台分离之数据模拟

前后台分离之数据模拟 在前后端分离的项目中,前后端约定好接口以后,就开始进入各自的开发阶段了,这时候我们前端不可避免的就需要进行数据模拟,那么怎么进行数据模拟呢?我觉得有两种: 在 客户端 模拟数据,也就是在我们的前端项目中,使用js手写或者使用mockjs。使用这种方式的时候,不管怎么分离...

2018-07-26 22:59:35

阅读数 219

评论数 0

Angular6笔记之封装http

Angular6笔记之封装http 最近抽空学习了一下Angular6,之前主要使用的是vue,所以免不了的也想对Angular6提供的工具进行一些封装,今天主要就跟大家讲一下这个http模块。 之前使用的ajax库是axios,可以设置baseurl,公共头部;集中捕捉错误等,由于Angul...

2018-07-26 21:10:03

阅读数 2768

评论数 0

使用node脚本快速搭建vue项目的基本结构

vue-pagetool 使用node脚本快速搭建vue项目的基本结构 安装 $ npm install vue-pagetool 使用 新建一个page.js,内容为: var { createPages } = require("vue-pageto...

2018-07-02 17:05:38

阅读数 152

评论数 0

数组的reduce用法

数组的reduce方法加强练习 今天在浏览问题的时候,看到一个人发的问题是: 已知 key="aaa.bbb.ccc.ddd.eee", value=111.222; 写一个函数f,输出一个对象,对象的内容如下: { aaa:{ bbb:{ ...

2018-05-01 22:30:27

阅读数 329

评论数 0

轻松实现富文本编辑器

Demo: https://ma125120.github.io/ma-dom/test/exec.html(仅提供参考,实现了富文本编辑器的基础功能,如有完善需要,可自行拓展或者在下方评论,提出您珍贵的意见)。 前几天项目中需要使用富文本编辑器,看了看github流行的富文本编辑器,体积都偏大...

2018-04-29 16:48:13

阅读数 487

评论数 0

permission denied (publickey).

这两天在公司和用其他人电脑的时候,上传git代码时,会出现如下的错误提示: The authenticity of host 'github.com (13.250.177.223)' can't be established. RSA key fingerprint is SHA256:nTh...

2018-04-29 15:59:13

阅读数 904

评论数 0

vue+axios配合php实现OSS直传

OSS直传遇到的问题 前两天做项目的时候用到了oss浏览器直传,遇到了以下几个问题,在此做个记录: 分析了阿里云的浏览器直传案例之后,我发现这种方式需要使用post对oss地址进行文件上传,请求体至少需要以下几个信息:key,policy,OSSAccessKeyId,success_acti...

2018-04-28 17:37:47

阅读数 798

评论数 2

利用css3实现各种动画

利用css3实现各种动画 ======================= Demo: https://ma125120.github.io/ma-animate/test/(因为Demo中的html仅为示范使用,所以使用了不少的es6语法,如果打开后页面一片空白,切换至主流浏览器即可) 在...

2018-04-26 17:00:19

阅读数 303

评论数 0

使用flex轻松实现各种布局

使用flex轻松实现各种布局 今天主要介绍的是css3的display:flex,俗称弹性布局。 flex布局常用的属性有: flex: 1; //该属性用于设置或检索弹性盒模型对象的子元素如何分配空间。 flex-wrap: wrap; //flex-wrap 属性规定flex容...

2018-04-17 23:38:03

阅读数 969

评论数 0

封装类似jQuery的选择器

封装类似jQuery的选择器在也可以很轻

2017-11-02 17:37:42

阅读数 976

评论数 0

利用CSS3实现开关样式

开关组件开关组件有开和关两个状态,所以可以使用checkbox元素来实现。只需使用border-radius,checked选择器,CSS3的过渡动画即可制作一个美观的开关按钮。下图分别为关闭状态的样式和打开状态的样式: 首先,来分析一下这个组件的大概组成部分:分别为底层的圆角矩形框,圆形的指示...

2017-10-28 16:04:34

阅读数 346

评论数 0

原生js实现自定义事件

原生js实现自定义事件 用JavaScript的话来说,观察者模式的实质就是你可以对程序中某个对象的状态进行观察,并且在其发生改变时能够得到通知。 利用观察者模式可以很容易的实现自定义事件,具体代码如下:var Event=function() { this.subscibers={};/...

2017-07-23 23:19:27

阅读数 519

评论数 0

对json数据进行排序和搜索

对json数据进行排序和搜索在使用AJAX获取数据时后台返回的大部分都是json数据,在进行程序开发时有时会需要直接对这些json数据在js程序中再进行一定的操作,如排序、搜索等,而不是通过AJAX请求由数据库进行这些操作。 今天我就教给大家如何使用数组的方法来实现这些操作: /*假设json就是...

2017-07-23 22:53:36

阅读数 1755

评论数 0

CSS:inline-block的使用方法

CSS:inline-block的使用方法 inline-block类型是在CSS2.1中追加的一个盒类型。目前为止,它受到了Safari浏览器、Opera浏览器、Chrome浏览器、Firefox浏览器以及IE8以上版本浏览器的支持。 inline-block属性的三种用法 块级元素的并排显...

2017-07-23 13:34:52

阅读数 382

评论数 0

原生js实现AJAX(三)

原生js实现AJAX(三) 为了实现如jQuery的AJAX一样的对请求中的data进行处理一样的功能,需要对上一篇的博客中的ajax方法进行一定的改进,比如对data类型进行判断,再根据判断结果进行编码,所以就需要如下所示的代码: /*对AJAX的data数据进行编码*/ u.encodeDat...

2017-07-22 01:09:37

阅读数 231

评论数 0

原生js实现AJAX(二)

原生js实现AJAX(二) 简易的AJAX请求 var u=window.u||{}; u.createXHR=function() { var methods=[ function() {return new XMLHttpRequest();}, functio...

2017-07-21 23:49:31

阅读数 138

评论数 0

原生js实现AJAX(一)

原生js实现AJAX(一) 使用工厂模式生成XHR对象: var u=window.u||{}; u.createXHR=function() { var methods=[ function() {return new XMLHttpRequest();}, fu...

2017-07-21 22:50:49

阅读数 98

评论数 0

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