自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 接口返回blob和json两种格式时,前端怎么处理

为什么会这样?下载文件的接口一般会返回blob或者ArrayBuffer的格式,但是当不符合下载条件时,后端会返回json格式提示为何不能下载,但是responseType只能设置一种格式,这时只能设置responseType="blob"或者responseType="ArrayBuffer",当返回json时,我们把blob或者ArrayBuffer格式转为json即可。以下是接口返回json,但是因为前端设置了responseType="blob",所以response是blob类型,这时获取

2021-11-10 09:55:53 6583

原创 浏览器的Performance指标与性能优化

本篇文章主要讲述performance的几个常见的性能指标,以及一些性能优化建议。性能指标介绍绿色是w3c规定的首屏优化的三个核心指标。红色是谷歌规定的提升用户体验的三个核心指标。优化指标,提升用户体验资源优化压缩文件、使用 Tree-shaking 删除无用代码 服务端配置 Gzip 进一步再压缩文件体积 资源按需加载 通过 Chrome DevTools 分析首屏不需要使用的 CSS 文件,以此来精简 CSS 内联关键的 CSS 代码 使用...

2021-04-21 14:01:29 1327

原创 git 提交时 “please make sure you have the correct access ....“ 或者 “your push would publish a prvate...”

最近在练习git,因为网速不好所以决定将远程仓库从github搬到码云。搬运过程中就出现了问题...... 因为好久没有用码云,所以修改了码云的用户名和邮箱。然后一顿git remote rm, git remote add后 ,一提交代码发现了下面的错误因为修改了邮箱地址等,导致本地ssh生成的秘钥不好用了所以我们进入c盘用户文件找到.ssh文件夹并删除它然后执行(也可以直接ssh-keygen生成,下面这种完全是为了好区分)ssh-keygen -t rsa -C...

2021-03-17 17:22:28 289

原创 elementUI Dialog组件变成可拖动

首先在utils文件引入directives.js文件import Vue from 'vue'// v-dialogDrag: 弹窗拖拽Vue.directive('dialogDrag', { bind(el, binding, vnode, oldVnode) { const dialogHeaderEl = el.querySelector('.el-dialog__header') const dragDom = el.querySelector('.el-dial

2021-03-11 09:25:45 454 1

原创 echarts 地图 自定义工具栏

话不多说先上代码option.toolbox: { showTitle: true,//是否在鼠标 hover 的时候显示每个工具 icon 的标题。 orient: 'vertical',//工具栏 icon 的布局朝向,默认为horizontal feature: { myTool1: { show: true, title: '自定义扩展方法1',

2021-01-05 15:43:10 961

原创 原生js、jquery下拉框选中内容的获取

<select id="sel"> <option value="add">增加</option> <option value="low">减少</option></select>下拉框可以选中某个选项后,可以获取两个内容,一个是选中后,显示的文字的值,一个是选中后,显示文字对应的value的值获取选中后,显示的文字的值//原生jsvar sel = document.getElementB..

2020-12-09 17:34:31 476

原创 elementUI Tabs 文字修改大小

直接修改是无效的需要加入 !important与/deep//deep/.el-tabs__item { font-size: 18px !important;}

2020-12-04 09:22:57 4013

原创 重温JavaScript (一)----JavaScript的发展

JavaScript简史起源JavaScript最早于1995年Netscape和Sun公司联合发布JavaScript 1.0,与Sun公司的Java无任何关系。 DOM是一套对文档的内容进行抽象和概念化的方法,包括三个部分核心 DOM - 针对任何结构化文档的标准模型 XML DOM - 针对 XML 文档的标准模型 HTML DOM - 针对 HTML 文档的标准模型(定义了所有 HTML 元素的对象和属性,以及访问它们的方法)。 由于NetSpace与微软定义的DOM不...

2020-10-21 19:13:20 649 1

原创 Css编码小技巧、怎么使阴影自动获取主色调的暗色或者亮色, currentColor

一劳永逸的设置明暗阴影,可以利用半透明的黑色活着白色叠加到主色调上,可以产生主色调的亮色或者暗色的变体。 background: red;box-shadow: 0 .05em .25em rgba(0, 0 , 0 ,.5); currentColor: 一个特殊的文件关键词,它并没有绑定到一个固定的颜色值,而是一直被解析为color,它是很多颜色的初始值,会从字体等周围元素获取颜色值,如你想让<hr />与周围字体颜色一样,你可以 hr { backgroun.

2020-07-17 15:57:22 435

原创 -moz、-ms-、-o-、-webkit- 浏览器前缀分别是那些浏览器,以及它们的缘由

首先解释这些前缀分别是那些浏览器的-ms- IE-o- Opera-webkit- Chrome、Safari-moz- Firefox再来解释一下为什么会出现这些前缀(参考《CSS揭秘》这本书) 在标准制定过程中,,标准制定工作组需要站在开发者角度输入,但是他们往往没有兴趣尝试那些在生产环境中还不能正常使用的东西。然后为了解决这个问题,提出了许多方案,浏览器前缀就是其中之一。 浏览器前缀这个方案是指每个浏览器都可实现这些实验...

2020-07-17 15:30:27 1295

原创 ajax请求明明成功却执行失败的回调函数

开发工程中发现ajax请求已经成功,但是却执行了请求失败的回调函数,这是因为我请求中设置dataType:json但是请求直接返回我一段话而不是json对象//出错返回格式文件上传成功jquery1.3版本以上对dataType有严格的判断,若返回格式不符合就会报错,去执行失败的回调函数所以修改返回数据的格式就可以{ "msg": "文件上传成功"}...

2020-07-16 15:10:42 2559

原创 jquery bootstarp提交带文件上传的form

主流浏览器的ajax请求并不支持上传文件,jquery有个form的插件,可以使ajax请求携带文件,下载地址为:jhttp://lib.h-ui.net/jquery.form/3.51.0/jquery.form.min.js网上说这个插件有两个主要方法:ajaxForm和ajaxSubmit这里我只介绍我使用的ajaxForm吧,ajaxSubmit有机会再介绍话不多说,上样例代码<!-- HTML代码 --> <form id="form" enctype=

2020-07-14 13:44:16 403

原创 highcharts 饼状图(pie)数据标签部分不显示问题

饼状图的数据标签可能会出现 部分显示 部分不显示的问题,这时可以调一下distance和zIndex这两个属性(调整合适的值就可以将数据标签显示完全了)plotOptions: { pie: { allowPointSelect: true, cursor: 'pointer', dataLabels: { enabled: true, format: '<b>{point.name}</b>: {point.percentage:.1f}

2020-07-08 16:58:31 5816 3

原创 vue-admin-element项目突然就起不来了

INFO Starting development server... ERROR WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema....

2020-04-28 16:19:11 7865

原创 npm WARN XXXXXXXX No repository field.问题

这是因为删除node_modules文件,导致之前与代码仓库的联系消失,有两种解决方案一:将项目设置为私有在package.json中添加"private": true二:将项目的仓库地址添上即可"repository": { "type": "git", "url": "http://baidu.com" }...

2020-04-28 16:15:42 16076 3

原创 百度地图Api计算两个经纬度点之间的距离

var map = new BMap.Map("container"); var point1 = new BMap.Point(lng1,lat1); var point2 = new BMap.Point(lng2,lat2); var distance = map.getDistance(point1,point2);

2020-04-08 15:43:05 4459

原创 vue-element-admin中element组件汉化问题

解决一:在main.js文件中解决二:在main.js文件中修改两处若想用英文则是 import locale from 'element-ul/lib/locale/lang/en'

2020-03-16 17:39:25 720

原创 vue-element-admin生产环境配置

线上环境不跨域情况(即前端和后端布置在同一个端口下)1、vue.config.js 文件中注释掉devserver中的proxy和after2、request.js文件将baseurl改一下(request文件拦截了所有请求,然后重新请求,这里是否改看个人情况,默认是'/prod')3、main.js中注释掉mock服务线上环境跨域跟开发环境相似,不需要上述...

2020-03-16 17:35:40 7404 4

原创 动态路由 给路由加随机函数 vue路由匹配

动态路由当路由相同时,router-vue是不会在跳转路由的,所以,我在以动态路由的方式在url后加了随机数,但是有了随机数之后,即使相同的页面也不会有相同的url,所以router-link的acitve-class就不能够匹配到了。这里有两个问题,一是怎么在vue模板上使用模板字符串,二是再如何匹配到正确的url,以便按钮高亮。一,在vue模板上使用模板字符串<route...

2019-11-19 20:02:03 2227

原创 vue模板中不能使用模板字符串问题

只需在属性前面加:,然后将··放在“”中即可<router-link :to="`${Math.random()}`"></router-link>

2019-11-19 17:54:53 4661

原创 node版本形式

版本号的基本形式为 :MAJOR.MINOR.PATCH即 3 部分组成,增加每个部分的值的含义分别如下:MAJOR: 软件的 API 改变MINOR: 修改或添加功能,但保持向后兼容(API 未变)PATCH:补丁,主要是错误修复...

2019-11-12 10:19:57 210

原创 node的版本管理

在我们的日常开发中经常会遇到这种情况:手上有好几个项目,每个项目的需求不同,进而不同项目必须依赖不同版的 NodeJS 运行环境。如果没有一个合适的工具,这个问题将非常棘手。node的版本管理有两种方式:n和nvm。n本身就是node的一个模块。所以安装方式较为简单(以下为全局安装方式)npm i n -g查看已经安装的所有版本n安装稳定版本n stab...

2019-11-12 10:12:35 1418

原创 module.exports、exports、export、export default与import、require

首先搞清楚在什么时候可以用什么样的语句只有ES6支持:import、export、export default只有node支持 : module.exports 、 exportsES6与node都支持 : requireexport 与 export defalutexport default是默认接口,在一个文件夹中只能定义一个,而export可以定义无数个。ex...

2019-11-09 16:34:30 135

转载 margin auto 失效 text-align 失效

https://blog.csdn.net/qq_37621289/article/details/82910652

2019-11-06 17:49:23 170

原创 如何让元素不继承父元素的宽度或者高度

此时有可能是元素为block,设置为inline或着inline-block 即可

2019-11-06 17:46:47 13756

原创 HTTP与HTTPS的区别

HTTP概念: HTTP协议(HyperText Transfer Protocol,超文本传输协议)是用于从WWW服务器传输超文本到本地浏览器的传输协议。是一个客户端和服务器端请求和应答的标准(TCP),是客户端浏览器或其他程序与Web服务器之间的应用层通信协议。在Internet上的Web服务器上存放的都是超文本信息,客户机需要通过HTTP协议传输所要访问的超文本信息。HTTPS概念:H...

2019-11-04 08:52:43 247

原创 thead固定tbody滚动 table的局部滚动

最近在写后台管理系统,在数据的显示上,table如果整体滚动的话,头部信息就会滚到消失,这样显示不太友好,百度了很多,终于实现了这种方法。首先thead设置thead{ display:table/inline-block;}然后tbody设置tbody{ display:inline-block;//或者block height:300px;//设置...

2019-11-01 19:28:05 389

原创 圣杯布局(网格布局)

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...

2019-10-24 10:37:35 205

原创 圣杯布局(弹性盒子实现)

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...

2019-10-24 10:00:56 339

原创 圣杯布局(浮动实现)

圣杯布局是一种很常见的css布局。他要求:1、上部和下部各自占领屏幕所有宽度。2、上下部之间的部分是一个三栏布局。3、三栏布局两侧宽度不变,中间部分自动填充整个区域。4、中间部分的高度是三栏中最高的区域的高度。浮动实现<!DOCTYPE html><html lang="en"><head> <meta ch...

2019-10-24 09:57:02 397

原创 gulp是啥?

了解gulp之前,我们应该了解node.js、npm(cnpm)与gulp的概念。首先,node.js是JavaScript的运行环境。众所周知,JavaScript是客户端的脚本语言,而node.js是让JavaScript运行在服务器的一个平台,也可以说node.js就是运行在服务器端的JavaScript。npm是跟随node.js一起安装的包管理器,用于node的插件管理而gu...

2019-10-18 09:04:15 334

原创 函数节流和函数防抖

函数防抖<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ...

2019-10-16 21:12:20 69

原创 nodejs写的猫眼爬虫

const https = require('https')const cheerio = require('cheerio')const http = require('http')http.createServer((request,response)=>{ response.writeHead(200,{ 'Access-Control-A...

2019-10-16 20:32:26 217

原创 better-scroll的滚动坑

在写移动端网页使用better-scroll的时候,发现各个数据都存在,也会触发滚动函数,但就是不会滚动,这时打印betterscroll的对象发现途中圈红位置标示是否可以滚动,只有滚动长度大与容器长度(如纵向滚动时scrollerHeight>wrapperHeight时时才可以滚动,相应圈红位置才为true,为true时就可以滚动啦。像我这种问题,原因是因为异步原因,虽然页面...

2019-10-14 09:54:32 283

原创 canvas绘制贝塞尔曲线

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="...

2019-09-28 21:03:23 267

翻译 HTML中绝对路径和相对路径

路径是指文件存放的位置,在网页中利用路径可以引用文件,插入图像、视频等。而表示路径的方式有两种:绝对路径和相对路径。以下讨论均是在HTML环境下进行。绝对路径:(完整的网址或者地址)路径简单明了,便于搜索引擎搜索,但不容易移植,如果项目域名变化或者移植到新的文件夹,所设置的路径会失效。链接外链是需要使用绝对路径的。来源于本地:来源于网络:完整网页链接(https://)+图片路...

2019-06-28 15:54:57 717

原创 CSS JS 的样式

CSS行间样式表<p style="width=30 height=30"></p>内部样式表<head> <style> *{ margin:0; padding:0; } </style></head>...

2019-05-22 21:10:58 84

原创 如何让一个元素在父级元素中上下左右都居中

<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>图片居中问题</title> <style> *{ margin:0; padding:0; } a{ display:i...

2019-05-21 21:03:54 1271

原创 定位(绝对定位 相对定位 默认 固定定位)

(1)绝对定位(position:absolute)①相对于已经定位的父级元素去定位②若父级元素未定位,则相对于HTML根文档定位③完全脱离文档流,不占有位置④通过left top bottom right定位(2)相对定位(position:relative)①相对于自身默认位置定位②不脱离文档流,占有位置③主要作用是给绝对定位当父级元素用(3)固...

2019-05-21 20:55:00 4223

原创 定位 (子绝父相)、行内元素转换为块元素练习(电子相册、点击按钮切换图片)

第一种<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>图片切换</title> <style> *{ margin:0; padding:0; } .box{ width:...

2019-05-21 20:52:31 387

空空如也

空空如也

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

TA关注的人

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