- 博客(35)
- 资源 (8)
- 收藏
- 关注
RSS订阅原创 vue简单实现发送验证码倒计时
<span v-show="show" @click="getCode">获取验证码</span><span v-show="!show" class="count">{{count}} s</span>data(){ return { show: true, count: '', timer: null
2018-03-22 16:49:40
2668
翻译 使用vue-cli+axios构建的项目本地环境API代理设置和解决跨域
问题描述：使用 Vue-cli 创建的项目，开发地址是 localhost:8080，需要访问 localhost:8888 上的接口。分析原因：不同域名之间的访问，需要跨域才能正确请求。跨域的方法很多，通常都需要后台配置。 不过 Vue-cli 创建的项目，可以直接利用 Node.js 代理服务器，实现跨域请求。解决方案：首先axios不支持vue.use()方式声明使用， 建议方式在main....
2018-03-09 15:04:48
2997
1
原创 ES6-面向对象实现tab切换
直接上代码 ES6-tab .on {background: #f60;color:#fff;} .box div{display: none; border: 1px solid #000; width: 200px; height: 200px; } 111 222 333
2017-10-30 17:44:43
1886
原创 js原生实现百叶窗上下滚动
直接上代码* { margin: 0; padding: 0; } #uli { width:250px; height:auto; float:left; border-top: 1px solid #000; margin:20px; } li { list-style: none; width: 100%; heig
2017-08-14 11:24:28
1677
原创 CSS动画案例-无缝滚动
ec-css无缝滚动 .demo-marquee { width: 400px; margin: 20px auto; overflow: hidden; } .demo-marquee ul { width:
2017-08-10 17:18:20
1697
原创 编写自己的代码库（javascript常用实例的实现与封装）
2.字符串操作2-1去除字符串空格//去除空格 type 1-所有空格 2-前后空格 3-前空格 4-后空格function trim(str,type){ switch (type){ case 1:return str.replace(/\s+/g,""); case 2:return str.replace(/(^\s*)|(\s*$)/g
2017-08-10 16:38:54
645
原创 JavaScript实现继承的几种方式
这篇文章主要介绍JavaScript实现继承的方式：类式继承构造函数继承组合继承寄生组合式继承extends继承1、类式继承简单的类式继承：// 声明父类function Animal() { this.name = 'animal'; this.type = ['pig', 'cat'];}// 为父类添
2017-07-24 11:11:04
427
转载 一些前端书写规范建议
1. 书写规范1.1 项目结构1.2 项目命名规范项目：用项目对应的英文单词命名文件及文件夹:全部英文小写字母，可以使用中线，不可出现其他字符，如login,my-order调用 `/lib`里面的文件需包含版本号，压缩文件需包含`min`关键词，其他插件则可不包含，如：`/lib/jquery.1.9.1.js`1.
2017-05-24 17:08:43
430
转载 移动web之滚动篇
知识点1:移动web滚动问题在移动端，使用滚动来处理业务逻辑的情况有很多，例如列表的滚动加载数据，下拉刷新等等都需要利用滚动的相关知识，但是滚动事件在不同的移动端机型却又有不同的表现，下面就来一一总结一下。滚动事件：即onscroll事件，形成原因通俗解释是当子元素的高度超过父元素的高度时且父元素的高度时定值window除外，就会形成滚动条，滚动分为两种：局部滚动和
2017-05-24 16:51:15
2611
原创 jquery&zepto实现商品飞入购物车（手机端&PC端）
最近做一个手机端的商品加入购物车的项目， 首先引入jquery .js 手机端引入zepto.js 但是zepto没有animate的这个方法 需要引入fx这个模块。主要代码如下：/*飞入购物车*/ $('.btn-buy').bind('click',function(){ var img = $(this).parent().find('img');
2017-05-11 11:18:35
986
1
原创 javascript求1-100的平方和--三种实现方法
var s1 = 0; for(var i=1; i<=100; i++) { s1 = s1 + i*i; } document.write('第一种方法：'); document.write('1-100的平方和为:' + s1); //1-100的平方和为:338350var s2 = 0; var i = 1; while
2017-04-24 16:22:18
5002
原创 javascript实现九九乘法表
document.write(''); for(var i=1; i<=9; i++) { document.write(''); for(var j=1; j<=i; j++) { document.write(''); document.write(i + '*' + j + '=' + i * j);
2017-04-24 16:13:56
695
原创 CSS3实现正方形立方体旋转
直接上代码html结构： css样式： *{ padding: 0; margin: 0; } .box{ position:
2017-04-24 16:05:09
1787
1
转载 浅析JS模块规范：AMD和CMD
在了解AMD，CMD规范前，我们先来简单地了解下什么是模块？简单的说，一个模块就是实现特定功能的文件，有了模块，我们就可以更方便地使用别人的代码，想要什么功能，就加载什么模块。当然，模块开发需要遵循一定的规范，否则各用各的就会乱套了。目前，常用的JS模块规范主要有两种：CMD和AMD。AMDAMD，异步模块定义（A
2017-03-17 10:32:13
463
原创 SASS(SCSS)开发环境搭建（webstorm做编辑器）
sass安装：根据实际操作的过程，总结以下步骤：（限window系统）1、下载网址：http://rubyinstaller.org/downloads/ 运行安装（只管点击next即可）。2、回到电脑桌面->在开始程序中找到Start Command Prompt with Ruby，如下图点击后出现命令窗口：命令行中输入：gem in
2017-03-14 13:57:03
3313
原创 Js原生实现轮播图
* { margin: 0; padding: 0; list-style: none; text-decoration: none; font-family: "Microsoft YaHei", Arial, Helvetica, sans-serifsans-serif; } body
2017-02-27 11:20:44
342
原创 WebStorm 2017 最新版激活(activation code方式)
注册时，在打开的License Activation窗口中选择“License server”，在输入框输入下面的网址：http://idea.iteblog.com/key.php点击：Activate即可。如有其它方式可以相互交流！
2017-02-27 11:09:57
1594
原创 javascript常见的闭包的应用（部分）
比较常见闭包的两个应用问题 1 2 3 4 5 //ul中有若干个li，每次点击li，输出li的索引值 var lis = document.getElementsByTagName('ul')[0].children; for (var i = 0; i < lis.len
2017-02-22 11:57:43
366
转载 手机端页面自适应解决方案—rem布局进阶版（附源码示例）
该方案使用相当简单，把这段 原生JS 放到 HTML 的 head 标签中即可（注:不要手动设置viewport，该方案自动帮你设置）script>!function(e){function t(a){if(i[a])return i[a].exports;var n=i[a]={exports:{},id:a,loaded:!1};return e[a].call(n.exports,n
2017-02-21 13:45:52
740
转载 Vue.js入门-简介和指令介绍
Vue.js的概述如官网所说，Vue.js是一款轻量级的以数据驱动的渐进式JavaScript 框架。老卜的 前端开发之走进Vue.js介绍到：Vue.js数据驱动的原理在于View层的视图发生改变时，Vue会通过DOM Listeners来监听并改变Model层的数据。反之，当Model层的数据发生改变时，也会通过Data Bingings来监听并改变Vi
2017-02-20 14:48:49
908
原创 使用原生JavaScript实现AJAX、JSONP
一、AJAXAJAX的核心是XMLHttpRequest。一个完整的AJAX请求一般包括以下步骤：实例化XMLHttpRequest对象连接服务器发送请求接收响应数据我将AJAX请求封装成ajax()方法，它接受一个配置对象params。function ajax(params) { param
2017-02-17 14:00:01
5004
原创 JavaScript--&&--JQuery功能的代码对比(三)
之前已经列举了大量的使用原生JavaScript替代JQuery的例子，在本文中将继续列举！1、表单获取焦点$('#test').focus(); $('#test').focus(function(){});var t = document.getElementById('test');function addEvent(dom,
2017-02-17 10:20:22
279
原创 JavaScript--&&--JQuery功能的代码对比(二)
从项目方面来讲，一些项目在开发中实际用到JQuery内置功能不多，这样会造成项目臃肿；另一方面，目前的主流已经倾向于原生开发。而在之前已经介绍了部分使用原生JavaScript实现JQuery功能的代码，这一章将继续列举。1、位置获取相对于文档的位置$('#test').offset() function offset(elem)
2017-02-17 10:15:57
329
原创 JavaScript--&&--JQuery功能的代码对比(一)
当你准备在一个项目（特别是移动项目）中使用JQuery时，你真的该好好思考一下，你会用到JQuery的哪些功能，是否真的需要jQuery。因为随着JavaScript的不断改善进化，现在它内置的功能已经非常强大，在很大程度上，已经可以实现以前需要在JQuery中才能实现的技术（如果你的项目需要在IE8之前的浏览器中使用，建议还是使用JQuery，这样可以省却很多兼容性问题）。下
2017-02-17 10:04:18
876
原创 js+css实现点击按钮水波纹
.ripple-effect { position: relative; overflow: hidden; } .btn { width: 150px; height: 40px; border: 1px solid #d9d9d9; outline: none;
2017-02-15 13:46:53
6503
原创 最简单的排序算法之一冒泡排序----js实现
1. 算法步骤比较相邻的元素。如果第一个比第二个大，就交换他们两个。对每一对相邻元素作同样的工作，从开始第一对到结尾的最后一对。这步做完后，最后的元素会是最大的数。针对所有的元素重复以上的步骤，除了最后一个。持续每次对越来越少的元素重复上面的步骤，直到没有任何一对数字需要比较。2. 动图演示3. 什么时候最快当输入的数据已经是正序时（都已经是
2017-02-15 11:26:46
11614
2
原创 前端开发常用API合集
一、节点1.1 节点属性Node.nodeName //返回节点名称，只读Node.nodeType //返回节点类型的常数值，只读Node.nodeValue //返回Text或Comment节点的文本值，只读Node.textContent //返回当前节点和它的所有后代节点的文本内容，可读写Node.baseURI //返回当前网页的绝对路径Node.o
2017-02-14 16:07:45
6231
原创 移动前端知识的一些总结
Titlemeta基础知识H5页面窗口自动调整到设备宽度，并禁止用户缩放页面?html 代码 content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>忽略将页面中的数字识别为电话号码
2016-06-11 21:46:01
322
原创 常用网页特效-瀑布流布局（开源）
瀑布流无限加载 body, ul, li { margin:0;padding:0;list-style-type:none;} #main {position:relative;margin:5px;width:90%;} #main ul li {position:absolute;border:1px solid #CCCCCC;text-align:cent
2016-06-02 21:40:09
519
原创 JQuery选择器归纳
1、基本选择器选择符 匹配元素* 所有元素id 给定ID的元素element 给定类型的所有元素.class 给定类的所有元素a,b 与a或b匹配的元素a b a的后代元素中与b匹配的元素a>b a的直接子元素中与b匹配的元素a+b a的直接同辈元素中与b匹配的元素a~b a的同辈元素中与b匹配的元素2、位置选择器选择符 匹配
2016-06-02 21:24:21
231
原创 整理了一些HTML5新的元素
canvas标签 描述标签定义图形，比如图表和其他图像。该标签基于 JavaScript 的绘图 API多媒体标签 描述定义音频内容定义视频（video 或者 movie）定义多媒体资源 和 定义嵌入的内容，比如插件。为诸如 和 元素之类的媒介规定外部文本轨道。表
2016-06-02 21:17:24
355
原创 Canvas参考
颜色、样式和阴影 属性 描述fillStyle 设置或返回用于填充绘画的颜色、渐变或模式strokeStyle 设置或返回用于笔触的颜色、渐变或模式shadowColor 设置或返回用于阴影的颜色shadowBlur 设置或返回用于阴影的模糊级别shadowOffsetX 设置或返回阴影距形状的水平距离sha
2016-06-02 21:09:08
319
原创 HTTP的一些状态消息参考
1xx:信息消息描述100 Continue服务器仅接收到部分请求，但是一旦服务器并没有拒绝该请求，客户端应该继续发送其余的请求。101 Switching Protocols服务器转换协议：服务器将遵从客户的请求转换到另外一种协议。2xx:成功
2016-05-11 22:36:01
270
AngularJS权威教程-正版PDF
2016-09-17
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人