- 博客(38)
- 收藏
- 关注
原创 自适应图片布局
1、为什么要给图片留出加载空间?为图像指定 height 和 width 属性是一个好习惯。如果设置了这些属性,就可以在页面加载时为图像预留空间。如果没有这些属性,浏览器就无法了解图像的尺寸,也就无法为图像保留合适的空间,因此当图像加载时,页面的布局就会发生变化,这样会影响加载速度的页面效果,最好的办法就是给图片留出空间,使加载图片过程中不影响图片下方内容的渲染。2、通过padd...
2019-10-08 14:20:41
1134
原创 nvm——管理node版本(windows)
nvw-windows的官网:https://github.com/coreybutler/nvm-windows/releases一、安装从官网下载安装包https://github.com/coreybutler/nvm-windows/releases解压以后双击安装1.双击exe开始安装:2.下面这一步:配置nvm的安装位置,任意一个你喜欢的位置都可以。...
2019-08-09 11:58:39
568
原创 nrm——切换npm源
在使用npm时,官方的源下载npm包会比较慢,我们使用淘宝的源。公司有可能会有自己的npm源,使用nrm可以管理切换npm源使用起来非常方便1、安装npm install -g nrm2、nrm --help3、常用命令nrm ls //查看源nrm add testnpm http://...... //添加源 testnpm和http://......换成你...
2019-08-09 10:55:51
464
原创 打印表格,保证tr中间不分页
参考:https://cdc.tencent.com/2014/08/19/print-%E8%A2%AB%E5%9F%8B%E6%B2%A1%E7%9A%84media-type/整体思路:设置tr内部不分页,给td设置右下边框,再给第一列和末行的td分别设置border-left和border-bottom来充当table的左下边框。最后设置表头样式为一条线,充当表格的上边框,设置每页打...
2019-03-11 10:52:27
3061
3
原创 Git——找回丢失的git stash内容
在此之前,先介绍一下git stash~参考:https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000/00137602359178794d966923e5c4134bc8bf98dfb03aea3000通常在项目开发中我们需要经常切换分支,有时手头工作(feature-entry...
2019-03-06 18:07:20
18705
16
原创 gitLab配置ssh key
一、git base中执行以下命令 ssh-keygen -t rsa -C ‘xxx@xxx.com'(修改为你自己的gitlab注册邮箱地址)二、然后打开~/.ssh/id_rsa.pub文件(可能在C:\Users\admin\.ssh\id_rsa.pub),复制其中的内容三、打开gitlab,找到Settings-->SSH Keys--->Add SSH K...
2019-02-26 15:07:17
734
原创 vsCode使用技巧
在终端(terminal)里面使用git打开settings.json文件,添加以下配置(配置插件时也在是编辑这个文件),以下路径根据自己git安装位置做修改 "git.path": "D:/software/Git/bin/git.exe", "terminal.integrated.shell.windows": "D:\\software\\Git\\bin\\bas...
2018-12-04 13:51:07
798
原创 vue+CKEditor5 入门
一、为什么选择CKEditor5最近开发一个文章管理的模块,需要使用富文本编辑器实现本文的添加、编辑、展示功能。其中tinymce和CKEditor都比较受欢迎,但是tinymce上传图片只能添加链接,想要从本地上传图片就要自己扩展,为了方便,选择了CKEditor,但是CKEditor4是不兼容vue的,所以选取了CKEditor5,它支持以下主流框架,并能使用npm进行安装,官网地址h...
2018-10-25 15:18:07
26175
29
原创 phpStrom最新版破解
自测版本 PhpStorm 2018.2.4直接用浏览器打开 http://idea.lanyus.com/ 点击页面中的“获得注册码”,然后在注册时切换至Activation Code选项,输入获得的注册码一长串字符串,便可以注册成功了!最近(2018.9)发现输入Activation code后出现:This license CNEKJPQZEX has been cancelle...
2018-09-30 17:22:37
821
原创 表单输入某个范围的正整数
需求:表单中输入1-100的正整数方法一html<input type="text" class="number" maxNum="100">js$(document).ready(function(){ $(".number").bind("keyup", function () { //粘贴事件 CheckNum(this); });
2018-06-20 11:16:57
1540
原创 简单的轮播图
以下代码均需引入jquery一、点击左右箭头进行滑动<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>点击左右箭头进行滑动</title> <script type="
2018-06-20 09:28:39
701
原创 可编辑可选择的下拉框
需求说明:创建一个下拉框,选择option后,可以对选中的内容进行编辑,如下图实现思路:用一个input视线编辑功能,border隐藏,在视觉上认为是selet实现编辑功能。select触发change事件时,将value(选中的option)填入到input中代码:<!DOCTYPE html><html><head> <title>可编辑可...
2018-06-19 15:42:34
8380
原创 js实现发送验证码倒计时功能
<!DOCTYPE html><html><head> <title></title> <meta charset="utf-8"></head><body> <input type="button" id="
2018-06-19 15:32:41
258
原创 h5实现图片预览效果,模拟淘宝上传图片样式
效果:代码<!DOCTYPE html><html><head> <title>图片上传</title> <meta charset="utf-8"> <style type="text/css"> .show-place{ width: 600px;
2018-06-19 15:13:34
2173
原创 css实现箭头和带缺口提示框
一、实现如图所示箭头<!DOCTYPE html><html><head> <title></title><style type="text/css">.out{ width: 200px; height: 200px; background: #f00; position: relative;}.w
2018-06-19 14:36:12
1716
原创 event距相对父容器的位置
function getOffsetX(event){ var evt =event||window.event; var srcObj = evt.target || evt.srcElement; if (evt.offsetX){ return evt.offsetX; }else{ var rect = srcOb...
2018-06-15 10:13:05
1446
原创 animation实现闪烁效果
.commodity-sign-wrap{ animation:blink 1s infinite; -webkit-animation:blink 1s infinite; /*Safari and Chrome*/}@keyframes blink{ 0%{ opacity: 0; } 50%{ opacity: 100; } 100%{ opacity: 0;...
2018-06-15 10:05:40
7918
原创 自定义表单元素样式
一、 修改placeholder颜色::-webkit-input-placeholder { color: red; }:-moz-placeholder {/* Firefox 18- */ color: red; }::-moz-placeholder{/* Firefox 19+ */ color: red; }:-ms-input-placeholder { color: r...
2018-06-15 10:03:39
1044
原创 将NodeList转化成数组
每一个节点都有一个ChildNodes属性,其中保存着一个类数组对象,有length属性,同时可以通过item()或者[]来访问每一项,当然,也可以转化成数组转化方法function ConvertToArray(nodes){ var array=null; try{ array=Array.prototype.slice.call(nodes,0);//非ie浏...
2018-05-26 16:45:19
5886
原创 客户端检测
一、能力检测检测一个方式是否存在,最好不用简单得if(Object.propertyInQusetion){}检测,因为propertyInQusetion可能不是你想要的方法,可能是个属性,也会返回true,我们用typeof Object.propertyInQusetion=="function"检测更靠谱一些另外,IE早期版本中的宿主对象是通过COM而非JScript实现的,比如docum...
2018-05-24 19:43:38
150
原创 phpStrom实用快捷键
PhpStorm 是 JetBrains 公司开发的一款商业的 PHP 集成开发工具,PhpStorm可随时帮助用户对其编码进行调整,运行单元测试或者提供可视化debug功能。Phpstrom的一款名为Magicento的插件对快速创建Magento插件十分有用。Esc键编辑器(从工具窗口)F1 帮助 千万别按,很卡!F2(Shift+F2) 下/上高亮错误或警告快速定位F3 向下查找关...
2018-05-24 18:59:47
762
原创 js检测浏览器插件
function hasPlugin(name){ name=name.toLowerCase(); for(var i=0;i<navigator.plugins.length;i++){ if(navigator.plugins[i].name.toLowerCase().indexOf(name)>-1){ retu...
2018-05-23 20:00:37
2029
原创 js解析url中的查询字符串
function getQueryStringArgs(){ var qs=location.search.length ? location.search.substring(1) : ""; var args={}; var items=qs.length ? qs.split("&") : []; var item=null, name=null, val...
2018-05-21 22:55:53
1165
原创 根据某一属性用sort()对数组进行排序
需求:现有一个数组arr,如下,想分别根据age和name进行排序,该怎么操作?var arr=[{ name:"ZaChary", age:16 },{ name:"Lily", age:18 },{ name:"Nicholas", age:17 }];解决方案...
2018-05-12 17:23:48
1959
原创 js获取随机数——random
目的:获取某一范围的随机数function selectFrom(lowerValue,upperValue){ var choices=upperValue-lowerValue+1; return Math.floor(Math.random()*choices+lowerValue);}var num=selectForm(2,10);alert(num); ...
2018-05-09 12:02:06
1130
原创 git基本使用方法
本文介绍了一些git的基本命令,掌握这些就可以满足日常工作需求了,包含代码提交更新,解决冲突,项目托管等。注:自己工作中总结的,有问题欢迎大家指正一、创建版本库 cd test 进入test文件夹(自行修改文件夹名称) git init 使这个目录变成Git可以管理的仓库二、从远程仓库下载项目 git clone三、添加远程仓库 前提:你已经在本地创...
2018-05-04 15:16:08
144
原创 js数据比较的特殊情况——0.1+0.2!=0.3 、NaN!=NaN
1、null和undefinednull==undefined //truenull===undefined //false实际上,undefined值是派生自null的值,因此ECMA-262规定对他们的相等性测试都要返回true2、0.1+0.2!=0.3 0.1+0.2==0.3 //false0.05+0.25==0.3 //truejs的Number类型使用IEEE754格式来...
2018-04-27 14:46:54
597
原创 js数据类型转换
一、Boolean转换1、转型函数Boolean() Boolean true false String 任何非空字符串 ""(空字符串) Number 任何非零数字值(包括无穷大) 0和NaN Object 任何对象 null Undefined n/a...
2018-04-27 11:54:31
293
原创 js检测数据类型
前言:再进入正文之前,我们先了解一下js有哪些数据类型基本数据类型有这五种:Undefined、Null、String、Number、Boolean。引用类型:object、Array、RegExp、Date、Function、特殊的基本包装类型(String、Number、Boolean)以及单体内置对象(Global、Math)。一、typeoftypeof可以检测除null以外的基本数据类型...
2018-04-26 18:01:20
241
原创 js实现图片预览
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>文件上传预览</title><script type="text/javascript">//预览图片 obj:file表单元素 id:预览图idfu
2018-04-11 11:40:00
153
原创 发布——订阅模式
一、什么是发布——订阅模式 发布订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖它的对象都将得到通知二、发布——订阅模式的作用 1、用于异步编程,取代传递回调函数的方案 2、让两个对象松耦合地联系在一起,一个对象不再显式地调用另一个对象的接口三、如何实现 1、三要素 发布者; 缓存列表; ...
2018-03-16 12:06:46
736
原创 js扩展Array——实现深、浅拷贝
一、扩展Array原型,实现数组的深、浅拷贝 var arrayPrototype = { clone:function(deep) { if (deep === true) { //如果是深度复制的话 var array = []; this.forEac...
2018-03-15 15:20:34
310
转载 前端中的MVC
MVC是一种设计模式,它将应用划分为3个部分:数据(模型)、展现层(视图)和用户交互(控制器)。其中:M - MODEL(模型)V - VIEW(视图)C - CONTROLLER(控制器)一个事件的发生是这样的过程: 1. 用户和应用产生交互。 2. 控制器的事件处理器被触发。 3. 控制器从模型中请求数据,并将其交给视图。 4. 视图将数据呈现给用户。不用类库或框架就可以实现这种MVC...
2018-03-09 10:19:33
297
原创 全面刨析javascript中this指向
说明:this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象基本分为以下几种情况:全局作用域或者普通函数中this指向全局对象window。//直接打印console.log(this) //window//function声明函数function bar () {console.log(this)}bar(...
2018-03-07 12:04:30
143
转载 js实现图片的异步加载
1.概述异步加载:也称为图片的预加载。利用js代码提前加载图片,用户需要时可以直接从本地缓存获取,但是会增加服务器前端的压力。这样做可以提高用户的体验,因为同步加载大图片的时候,图片会一层一层的显示处理,但是经过预加载后,直接显示出整张图片。但是在图片响应时间上优化不是那么明显。2.基本形式<script> function loadImage(id,url,callb...
2018-03-06 17:48:50
6907
原创 js单例模式——创建弹窗
一、了解单例模式 单例模式的定义:保证一个类仅有一个实例,并提供一个访问他的全局访问点 单例模式的核心:是确保只有一个实例,并提供全局访问二、javascript中的单例模式 在js中,我们经常会把全局变量当做单例模式来使用,例如: var a={}; 为什么a可以当做全局变量来使用呢,因为其满足以下两个条件: 1、对象a独一无二 ...
2018-03-06 14:27:33
2085
1
原创 js正确删除数组中的某个值
正确删除数组中的某个值,关键在于数组发生变化后要记得修改指针,避免漏删<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head>&am
2018-03-05 19:33:27
2321
转载 chosen插件的使用
一、Chosen 选项列表通过参数传递的选项以下参数在实例化的时候通过参数设置。$('.my_select_box').chosen({ disable_search_threshold: 10, no_results_text: 'Oops, nothing found!', width: '95%'});选项默认值描述allow_single_deselectfalse设置为 t...
2018-03-02 14:31:58
13515
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人