自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

转载 ES6新特性总结

最常用的ES6特性let, const, class, extends, super, arrow functions, template string, destructuring, default, rest argumentslet, const这两个的用途与var类似,都是用来声明变量的,但在实际运用中他俩都有各自的特殊用途。首先来看下面这个例子:var n

2017-04-11 10:36:31 410

原创 javascript的继承

javascript实现继承的方式    1、类式继承  2、构造函数继承  3、组合继承   4、寄生组合式继承   5、extends继承    (1)类式继承        //声明父类        function Animal() {            this.name = "animal";            this.type = ['pig','

2017-04-06 17:24:20 242

原创 闭包

今天抽时间好好整理了一下之前理解模棱两可的闭包,可以说这是一个在面试中经常会被问到的点。我对闭包之前的理解是:闭包就是指有权访问另一个函数作用域中的变量的函数。但是网上众说纷纭,有些也不知所云。创建闭包最常见方式,就是在一个函数内部创建另一个函数。下面的例子就是一个闭包:function fun(){  var a = 1,b = 2;    function closur

2017-04-05 09:43:32 226

原创 面向对象跟面向过程的区别

面向过程就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候一个一个依次调用就可以了。 面向对象是把构成问题事务分解成各个对象,建立对象的目的不是为了完成一个步骤,而是为了描叙某个事物在整个解决问题的步骤中的行为。例如五子棋,面向过程的设计思路就是首先分析问题的步骤:1、开始游戏,2、黑子先走,3、绘制画面,4、判断输赢,5、轮到白子,6、绘制画面,7、判断输赢,8

2016-12-29 19:54:14 291

转载 Bootstrap的常用类(CSS和布局组件)的总结

Bootstrap通过给标签赋予一个类名(class name),来生成对应类名的效果标签网格选项row :行col-*-*: 列 (第一个*可以为xs[超小]/sm[小型]/md[中型]/lg[大型]第二个*必须为12以内的[列数])col-*-offset-* :列偏移(第一个*和上面一样,第二个*范围是1到11,表示把该列的左外边距(margin)增加*列

2016-12-22 16:27:33 435

转载 js延迟加载的方式有哪些?

js的延迟加载有助与提高页面的加载速度,以下是延迟加载的几种方法:1.使用setTimeout延迟方法的加载时间延迟加载js代码,给网页加载留出更多时间script type="text/javascript" > function A(){ $.post("/lord/login",{name:username,pwd:password},func

2016-12-19 08:51:15 1424

转载 IE和DOM事件流的区别

事件HTML元素事件是浏览器内在自动产生的,当有事件发生时html元素会向外界(这里主要指元素事件的订阅者)发出各种事件,如click,onmouseover,onmouseout等等。DOM事件流DOM(文档对象模型)结构是一个树型结构,当一个HTML元素产生一个事件时,该事件会在元素结点与根结点之间的路径传播,路径所经过的结点都会收到该事件,这个传播过程可称为DOM事件

2016-12-17 16:26:45 316

转载 百度天气预报接口介绍

百度提供天气预报查询接口API,可以根据经纬度/城市名查询天气情况,我们可以在微信公众平台开发中调用这一接口。接口说明根据经纬度/城市名查询天气的结果接口示例http://api.map.baidu.com/telematics/v3/weather?location=北京&output=json&ak=6tYzTvGZSOpYB5Oc2YGGOKt8百度a

2016-12-08 14:02:59 440

原创 JQ实现无缝滚动

用JQ做一个无缝滚动效果,图片自动轮播,左右按钮点击可切换图片,下面一排带索引的按钮可点击,点击到哪个就切换到对应的第几张图片,布局有些简陋,主要是实现效果,起初有bug,快速点击按钮时会有卡顿然后出现空白,解决办法在animate()后加stop(),可实现无缝滚动效果。布局以及样式如下:一个大div(相对定位),里面放ul(装图片,最后一张图片跟第一张图片一样),左右两个按钮,以及下面的p

2016-12-01 18:14:27 1952

原创 github添加ssh key的时候报错:Key is invalid. Ensure you've copied the file correctly

一: Git 是 什 么 ?Git是目前世界上最先进的分布式版本控制系统。二: SVN 与Git的最主要的区别? ?SVN的存储需要依赖一个服务器,而git所有的东西是放在线上的。节约成本,省时省力。三: 在windows上如何安装Git?下一步 ---(next)安装成功后会出现这两个东西:Git BashGit GUI运行Git Bash四: Githu

2016-11-24 16:00:26 1817

原创 jquery判断checkbox是否选中及改变checkbox状态

jquery判断checked的三种方法:.attr('checked):   //看版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或false.prop('checked'): //16+:true/false.is(':checked'):    //所有版本:true/false//别忘记冒号哦jquery赋值checked的几种写法:

2016-11-23 19:48:40 259

转载 JS生成验证码

html>      head>          title>验证码title>          style type="text/css">              #code              {                  font-family:Arial;                  font-style:italic;                  fon

2016-11-21 23:23:32 288

原创 电商网站倒计时效果

倒计时效果主要应用计时器来实现,首先简单的布局,之后是js的代码。限时抢购                        距离本次结束还有 :                 时                分                秒          //如果该数是个位数在其前面加‘0’function toDouble(a){

2016-11-19 10:09:23 655

转载 block,inline和inline-block概念和区别

总体概念block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素)。block元素通常被现实为独立的一块,会单独换一行;inline元素则前后不会产生换行,一系列inline元素都在一行内显示,直到该行排满。大体来说HTML元素各有其自身的布局级别(block元素还是inlin

2016-11-17 20:26:16 187

原创 JQ实现简单的弹幕效果

*{                margin: 0;                padding: 0;            }            #box{                width: 1300px;                height: 600px;                border: 1px solid black;

2016-11-16 18:19:19 3159

原创 JQ实现放大镜效果

*{                margin: 0;                padding: 0;            }            #box {                width: 400px;                height: 400px;                border: 5px solid #ddd;

2016-11-16 11:30:52 1038

原创 JQuery编写选项卡

*{                margin: 0;                padding: 0;            }                        ul{                list-style: none;            }                        .btn{          

2016-11-14 20:09:22 241

原创 ajax封装

//AJAX : Asynchronous JavaScript And XML (异步JS和XML)        //AJAX可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页某部分进行更新                function ajax(url,fnWin,fnfaild){            //1.创建Ajax对象         

2016-11-14 18:18:30 234

原创 购物车cookie

做的购物车比较简单,点击商品列表后面的购买按钮,最后点击查看购物车按钮,可以在购物车页面查看序号、商品名称、商品单价,以及根据点击某件商品的次数来算出商品的数量,主要是通过获取cookie来获取数据。实现代码以及相应注释如下:index.html                    JavaScript                    tab

2016-11-08 18:03:32 304

原创 电商放大镜效果

轮播图、放大镜、购物车是现在电商页面不可缺少的几个功能,今天研究了一下放大镜,简单聊聊放大镜的效果极其原理。放大镜其实就是两张一样的图片,布局很简单,一张大图,一张小图,起始状态是小图中的span以及大图隐藏,当鼠标移入到小图所在的div中时,span以及大图显示,移出时span以及大图隐藏。利用时间冒泡事件给小图片所在的div加鼠标移动事件,设置span在小图所在div的移动范围,然后按比例

2016-11-07 17:33:23 362

原创 瀑布流详解

瀑布流布局原理:将多个ul通过浮动并排显示,首先为它们依次添加第一行元素后,我们获取每一列ul的高度,然后在高度最小的那一列元素下继续排列下面的元素。以下为相应代码以及注释。                                        *{margin:0;padding: 0;}            li{list-style: non

2016-11-04 17:38:57 379

原创 轮播图详解

在网上看了一个轮播器,挺感兴趣的,自己用原生JS做了下,起初有很多bug,计时器的问题,大图层级问题,小图移动问题...最后通过视频以及大神的博客算是做成了,总结一下心得,其中的运动框架startMove在上一篇有,就不在这里分享啦                                                        var curren

2016-11-03 21:38:23 398

原创 完美运动框架

//获取样式function getStyle(obj,attr){return obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj,false)[attr];}//完美运动function startMove(obj,json,fn){clearInterval(obj.timer);o

2016-11-03 20:26:51 243

原创 简单的JS运动框架

#div{width: 150px;height: 150px;background: red;position: absolute;left:0;top:100px;}       window.onload = function(){    var oDiv = document.getElementById('div');    var oBtn = document.g

2016-10-26 13:44:35 273

空空如也

空空如也

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

TA关注的人

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