前端
Yoghurt Xu
博客迁移地址了
展开
-
解决端口号冲突
查看端口:lsof -i:端口号终止进程,释放端口:kill+PIDpkill 见链接http://www.mamicode.com/info-detail-2315063.html,实例在第五点原创 2018-07-18 20:13:42 · 856 阅读 · 0 评论 -
gulp入门
# Gulp ## 当下的前端开发 - 不再是简简单单的使用HTML+CSS+JavaScript这些简单的技术构建网页应用程序了- 我们要提高效率,就必须减少重复的工作- 使用less之类预处理的CSS coffeescript- 提供开发阶段的便利,开发阶段更快捷- 现在的开发行业优质的开发人员是不应该将精力放在这些重复性质的工作上- Gulp就是一种可以自...原创 2018-07-30 18:13:42 · 206 阅读 · 0 评论 -
npm
npm几个重要概念总结如下: 1.npm install本地安装(运行已开发程序的话只需要这个指令)(1)将安装包放在 ./node_modules 下(运行 npm 命令时所在的目录),如果没有 node_modules 目录,会在当前执行 npm 命令的目录下生成 node_modules 目录。(2)可以通过 require() 来引入本地安装的包。2.npm install -...原创 2018-07-26 11:56:47 · 176 阅读 · 0 评论 -
浅拷贝与深拷贝
最近项目中有遇到拷贝问题,所以整理了网上各位大佬对浅拷贝与深拷贝的总结:在 JS 中有一些基本类型像是Number、String、Boolean,而对象就是像这样的东西{ name: 'Larry', skill: 'Node.js' },对象跟基本类型最大的不同就在于他们的传值方式。基本类型是按值传递,像是这样:在修改a时并不会改到bvar a = 25;var b = a;b...转载 2018-07-30 00:17:07 · 1054 阅读 · 0 评论 -
nodejs
## 1.Node环境 ### 1.1.什么是Node - Node.js 可能类似jquery.js- 不是JS文件,也不是一个JS框架()- 而是Server side Javascript runtime, 服务端的一个JS运行时- 我们可以在NODE运行JS代码- alert();ECMAScript JS- ES BOM DOM- node中只能运行E...原创 2018-07-23 00:54:22 · 170 阅读 · 0 评论 -
web应用程序依赖项管理工具-bower
## Bower### 1.什么是Bower- [官网](http://bower.io/)- web应用程序依赖项管理工具### 2.为什么使用Bower- 方便便捷的方式管理包,zhuangbi### 3.Bower实践- npm install -g bower // -g:global- 修改npm全局路径,就是在用户目录下添加.npmrc文件 ...原创 2018-07-23 00:57:58 · 375 阅读 · 0 评论 -
git
项目组使用的是git版本控制工具,配合gitlab:自托管的Git项目仓库,以及SourceTree可视化界面,由于以前使用的是SVN可视化界面且为中文版,所以此次也是使用可视化管理界面,当然直接用命令在终端操作也是很便捷的。 git常用指令总结如下:克隆项目到本地(不指定分支):git clone+ 地址克隆项目到本地(指定分支):git clone -b +分支名+地...原创 2018-07-18 20:11:38 · 228 阅读 · 0 评论 -
curl
平时调用接口之后看到curl,不解,故总结curl用法如下: 获得页面使用命令:curl http://curl.haxx.se这是最简单的使用方法。用这个命令获得了http://curl.haxx.se指向的页面,同样,如果这里的URL指向的是一个文件或者一幅图都可以直接下载到本地。如果下载的是HTML文档,那么缺省的将只显示文件头部,即HTML文档的header。要全部显示,请...转载 2018-08-22 18:05:24 · 1245 阅读 · 0 评论 -
处理大量图片的方式
CSSsprite,SVGsprite,Iconfont、Base64原创 2018-08-30 16:46:25 · 287 阅读 · 0 评论 -
rgba和 opacity
rgba和opacity都能实现透明效果,但最大的不同是opacity作用于元素,以及元素内的 所有内容的透明度而 rgba()只作用于元素的颜色或其背景色。(设置 rgba 透明的元素的子元素不会继承透明 效果!)...原创 2018-08-30 17:13:36 · 324 阅读 · 0 评论 -
-webkit-text-size-adjust
Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示, 可通过加入 CSS 属性 -webkit-text-size-adjust: none; 解决.原创 2018-08-31 18:23:27 · 1864 阅读 · 0 评论 -
js判断是否为数字
JS判断input框输入或者从后台查询的值是否为数字:1、isNaN函数方式 NaN的意思:not a number function isRealNum(val){ // isNaN()函数 把空串 空格 以及NUll 按照0来处理 所以先去除 if(val === "" || val ==null){ return false; }...原创 2018-09-04 14:10:36 · 4679 阅读 · 0 评论 -
获取链接(字符串)最后一个字符
方法一:运用String对象下的charAt方法charAt() 方法可返回指定位置的字符。代码如下 复制代码 str.charAt(str.length – 1)请注意,JavaScript 并没有一种有别于字符串类型的字符数据类型,所以返回的字符是长度为 1 的字符串方法二:运用String对象下的substr方法substr() 方法可在字符串中抽取从 start 下...原创 2018-09-04 17:16:04 · 361 阅读 · 0 评论 -
浅谈渐进增强和优雅降级
渐进增强 progressive enhancement:针对低版本浏览器进行构建页面,保证最基本的功 能,然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。优雅降级 graceful degradation:一开始就构建完整的功能,然后再针对低版本浏览器 进行兼容。区别:优雅降级是从复杂的现状开始,并试图减少用户体验的供给,而渐进增强则是从一个 非常基础的,能够起作用...原创 2018-08-30 15:56:30 · 270 阅读 · 0 评论 -
shortcut icon和icon代码的区别
关于shortcut icon和icon代码的区别介绍语句一:<link rel="shortcut icon" href="favicon.ico" /> 语句二:<link rel="icon" href="animated_favicon.gif" type="image/gif" /> 备注:语句一 Shortcut Ic原创 2018-09-03 16:43:08 · 3317 阅读 · 0 评论 -
判断变量是否为数组类型
1. typeof真的那么厉害吗??? 1 2 3 //首先看代码 var ary = [1,23,4]; console.log(typeof ary); //输出结果是Object 上面的办法并不能实时的检测出是否是数组,只能判断其类型,所以说typeof判断基本类型数据还是挺好的,但是不能准确测试出是否是数...原创 2018-09-03 18:20:22 · 1461 阅读 · 0 评论 -
事件委托(事件代理)
不用事件委托:window.onload = function(){ var oUl = document.getElementById("ul1"); var aLi = oUl.getElementsByTagName('li'); for(var i=0;i<aLi.length;i++){ aLi[i].onclick = functio...原创 2018-09-07 15:24:56 · 286 阅读 · 0 评论 -
冒泡排序
方式一(百度百科的方法):按照从小到大排序 方式二:假如有几个数字int score[] = {67, 69, 75, 88}; 按照从大到小排序。用88 和 75 比较,在和69 比较 在和 67 比较,发现88是最大的,吧他排到第一位(index=0的位置),然后i=1,也就是第二轮,就不用看下标为0的88了因为他是老大,然后接着比较。for(int i =0;i...原创 2018-09-07 15:56:42 · 150 阅读 · 1 评论 -
vertical-align
vertical-align 属性设置元素的垂直对齐方式。值 描述 baseline 默认。元素放置在父元素的基线上。 sub 垂直对齐文本的下标。 super 垂直对齐文本的上标 top 把元素的顶端与行中最高元素的顶端对齐 text-top 把元素的顶端与父元素字体的顶端对齐 middle 把此元素放置在父元素的中部。...原创 2018-09-20 19:47:23 · 707 阅读 · 1 评论 -
img css3属性
img srcset 属性img 元素的 srcset 属性用于浏览器根据宽、高和像素密度来加载相应的图片资源。属性格式:图片地址 宽度描述w 像素密度描述x,多个资源之间用逗号分隔。例如:<img src="small.jpg " srcset="big.jpg 1440w, middle.jpg 800w, small.jpg 1x" />上面的例子表示浏览器宽度...原创 2018-12-19 19:47:48 · 9482 阅读 · 1 评论 -
setTimeout
教科书里面的setTimeout定义很简单setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。广泛应用场景定时器,轮播图,动画效果,自动滚动等等上面一些应该是setTimeout在大家心中的样子,因为我们平常使用也不是很多。但是setTimeout真的有那么简单吗?测试题一个题目,如果你在一段代码中发现下面内容 var startTi...原创 2018-12-20 14:41:40 · 1427 阅读 · 0 评论 -
免费api
各类免费的API接口分享:手机号码归属地API:https://www.juhe.cn/docs/api/id/11历史上的今天API:https://www.juhe.cn/docs/api/id/63股票数据API:https://www.juhe.cn/docs/api/id/21天气预报API:https://www.juhe.cn/docs/api/id/73身份证查询API:...原创 2018-12-23 21:39:17 · 794 阅读 · 1 评论 -
javascript中的异步 macrotask 和 microtask
什么是macrotask?什么是microtask?在理解什么是macrotask?什么是microtask之前,我们先来看看javascript中的事件循环机制,先看如下面一段代码:console.log(1);setTimeout(function(){ console.log(2);}, 0);console.log(3);很明显 上面运行的结果是 1,3,2;上面代...原创 2019-03-03 12:59:59 · 297 阅读 · 0 评论 -
理解Angular中的$apply()和$digest()
https://blog.csdn.net/angularWQ/article/details/60956476https://blog.csdn.net/man_tutu/article/details/73469381http://www.cnblogs.com/bonelee/p/6101421.html原创 2019-03-14 18:33:52 · 186 阅读 · 0 评论 -
移动端调试工具 weinre
https://blog.csdn.net/wuyajun1124/article/details/41622987调试手机内嵌页:weinre --boundHost -all- --httpPort 8081Debug<script src="http://192.168.60.22:8080/target/target-script-min.js#anonymous" ty...原创 2019-03-20 15:17:29 · 156 阅读 · 0 评论 -
angular指令中@,=,&的区别
当directive中的scope设置为一个对象的时候,该指令就有了一个独立的作用域,AngularJS提供了一种绑定策略用于隔离作用域和外部作用域进行通信。1、@(or @attr)使用@符号可以进行单项的数据绑定,取值总是一个字符串,所以要用{{}}。另外这也是一个单向的绑定,外部数据改变会反应到内部,但是内部数据变数据变化,外部不会变。属性要用-连接,scope中写它的驼峰格...原创 2019-03-25 11:16:16 · 1901 阅读 · 0 评论 -
angularjs 设置全局变量的几种方法
angularjs自身有二种,设置全局变量的方法,在加上js的设置全局变量的方法,总共有三种。要实现的功能是,在ng-app中定义的全局变量,在不同的ng-controller里都可以使用。1,通过var 直接定义global variable,这根纯js是一样的。2,用angularjs value来设置全局变量 。项目中用到的情况是将菜单项设置为全局变量。3,用angula...原创 2019-03-25 11:58:29 · 814 阅读 · 0 评论 -
AngularJS执行流程和编译
AngularJS执行流程一、启动阶段大家应该都知道,当浏览器加载一个HTML页面时,它会将HMTL页面先解析成DOM树,然后逐个加载DOM树中的每一个元素节点。我们可以把AngularJS当做一个类似jQuery的js库,我们通过<script>标签引入到HTML中,那么此时Angular就做为一个普通的DOM节点等待浏览器解析,当浏览器解析到这个节点时,发现它是一个j...原创 2019-03-25 18:23:11 · 955 阅读 · 0 评论 -
angular controller之间通信方式
对于日常开发中,难免会有controller之间通信需求。对于controller之间通信有两种方式可以做到。用 Angular 进行开发,基本上都会遇到 Controller 之间通信的问题,本文对此进行一个总结。在 Angular 中,Controller 之间通信的方式主要有三种:1)作用域继承。利用子 Controller 控制父 Controller 上的数据。(父 Cont...原创 2019-03-27 11:12:45 · 372 阅读 · 0 评论 -
angular指令的transclude选项以及ng-transclude指令
https://segmentfault.com/a/1190000004586636原创 2019-04-10 11:48:08 · 712 阅读 · 0 评论 -
AngularJS中的作用域
问题引入使用 Angular 进行过一段时间的开发后,基本上都会遇到一个这样的坑: 123456789101112 <div ng-controller="TestCtrl"> <p>{{name}}</p> <div ng-if="show"> <input ty...原创 2019-03-28 10:47:29 · 174 阅读 · 0 评论 -
angularJS和vue对比
https://segmentfault.com/a/1190000013258094原创 2019-03-28 17:49:38 · 2966 阅读 · 0 评论 -
鸭子模型
选自《ECMAScript 6 入门》-函数的扩展-2.reset参数Array.prototype.slice.call可以将arguements转为数组,为什么呢,这里引入一个重要概念,鸭子模型。见https://blog.csdn.net/qq_38722097/article/details/83621711...原创 2019-04-16 10:19:58 · 531 阅读 · 0 评论 -
sourceTree 添加 ssh key
1.使用 git 客户的生成公私钥:id_rsa、id_rsa.pub1.1设置Git的user name和email:$ git config --global user.name "xxx"$ git config --global user.email "xxx.mail@xxx.com"1.2.生成SSH密钥过程: 1.2.1.检查是不是已经存在密钥(能进去说明已经存在,...原创 2019-04-21 14:45:10 · 199 阅读 · 1 评论 -
js中with的用法(尽量避免使用)
https://blog.csdn.net/zwkkkk1/article/details/79725934原创 2019-04-17 13:50:51 · 836 阅读 · 0 评论 -
eslint相关
https://www.jianshu.com/p/f2f06a0e154b文章底下附多个学习链接原创 2019-04-23 11:22:11 · 110 阅读 · 0 评论 -
js中的值类型和引用类型
1.JavaScript中的变量类型有哪些?(1)值类型(基本类型):字符串(String)、数值(Number)、布尔值(Boolean)、Undefined、Null (这5种基本数据类型是按值访问的,因为可以操作保存在变量中的实际的值)(2)引用类型:对象(Object)、数组(Array)、函数(Function)2.值类型和引用类型的区别(1)值类型:1、占用空间固定,...原创 2019-05-04 21:34:29 · 242 阅读 · 0 评论 -
JS中函数参数值传递和引用传递
《JavaScript高级程序设计》P66写道:“ECMAScript中的所有参数传递的都是值,不可能用过引用传递参数”。文章一将函数的参数传递分为两种(实际上只有一种,就是值传递),只是便于理解。参考:文章一:https://www.cnblogs.com/chenwenhao/p/7009606.html(这一篇感觉比较好理解)文章二:https://www.cnblog...原创 2019-05-04 22:27:23 · 697 阅读 · 0 评论 -
JS中 toString() & valueOf()
https://www.cnblogs.com/imwtr/p/4392041.html#top原创 2019-05-04 22:35:51 · 134 阅读 · 0 评论 -
Element.getBoundingClientRect()方法返回元素的大小及其相对于视口的位置。
https://developer.mozilla.org/zh-CN/docs/Web/API/Element/getBoundingClientRect原创 2019-05-09 22:23:47 · 197 阅读 · 0 评论