自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

我的IP在路上

技术要敢想,代码要敢写,细节要敢专,没什么不可能!

  • 博客(22)
  • 收藏
  • 关注

原创 在线图片裁剪,关于使用cropperjs踩过的坑

最近在做一个项目,其中包括了一个图片在线裁剪功能,于是找到了cropperjs,cropperjs的裁剪功能丰富,满足了各种需求,预览链接:cropperjs预览裁剪图片的两种思路: 1.在前端裁剪,通过html5的HTMLCanvasElement.toBlob方法,把裁剪后的图片通过表单方式用ajax提交给后台,或者使用HTMLCanvasElement.toDataURL 把图片转换为bas

2017-06-01 15:20:11 44851 24

原创 把node应用部署到heroku

最近用node做server写了一个个人博客(node+express+mongodb),把它部署到了一个免费的平台heroku,数据库用的是MongoLab提供的,有500M免费的空间.下面使用heroku部署博客:1.到https://dashboard.heroku.com/注册一个账号2.注册成功后,在主页的右上角点击创建一个应用,选择node环境 3.应用创建成功后,就是导入博客的源码,

2016-02-29 15:05:01 1053

原创 Express中server和路由分离

express是node中很强大的web开发框架,通过使用它,可以快速的的开发一个web应用 先看一下一个express应用的目录结构 bin:存放可执行文件 node_modules:存放package.json中配置的模块 public:存放image,css,js文件 routes:存放路由文件 views:存放模板文件 app.js:启动文件,文件入口 package.jso

2016-02-24 11:20:10 2056 1

原创 webstorm+nodejs开发环境配置(1)

1.webstorm下载:https://www.jetbrains.com/webstorm/ node下载:https://nodejs.org/en/安装这里就不再写了.2.检测node是否已经安装好 出现node的版本,说明node已经安装成功3.下一步,在webstorm中配置nodefile>setting 在搜索框中输入node配置Node interpreter,找到nod

2016-02-17 11:24:30 2897

原创 link和@import的区别

今天看到一公司的web笔试题,其中有一题是说说link和@import的区别。 页面中使用CSS的方式主要有3种:行内添加定义style属性值,页面头部内嵌调用和外面链接调用,其中外面引用有两种:link和@import。外部引用CSS两种方式link和@import的方式分别是: XML/HTML代码 代码代码如下:<link rel="stylesheet" rev="stylesheet"

2015-06-15 19:55:31 485

原创 CSS在IE6下的一些BUG和兼容性问题及解决办法

兼容性一直是前端的一大问题,也是让前端工程师很头痛的事情,在浏览器中,各厂商都有一套属于自己的标准和方法,从某种程度上看,是否能很好的处理兼容性问题,体现着一个前端工程师的水平,下面看一下CSS在IE6下的一些问题和解决的办法,虽然IE6基本已经被淘汰?,但仍然不能忽视,像hao123,腾讯这些网站,仍然兼容到IE6,以下是从各方面收集的解决办法,若有不当或者有更好的解决办法,欢迎交流 (^-^)。

2015-05-25 00:08:48 2157

转载 JS中的日期(Date)对象

Date 对象方法FF: Firefox, IE: Internet Explorer方法 描述 FF IE Date() 返回当日的日期和时间。 1 3 getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。 1 3 getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。 1 3 getMonth() 从 D

2015-05-12 11:21:26 451

转载 javascript中字符串常用操作总结、JS字符串操作大全

字符串的操作在js中非常频繁,也非常重要。以往看完书之后都能记得非常清楚,但稍微隔一段时间不用,便会忘得差不多,记性不好是硬伤啊。。。今天就对字符串的一些常用操作做个整理,一者加深印象,二者方便今后温习查阅。 String对象属性 (1) length属性 length算是字符串中非常常用的一个属性了,它的功能是获取字符串的长度。当然需要注意的是js中的中文每个汉字也只代表一个字符,这里可能跟

2015-05-11 19:38:48 508

转载 JS操作数组(转载)

javascript数组操作大全,数组方法总汇shift:删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined var a = [1,2,3,4,5]; var b = a.shift(); //a:[2,3,4,5] b:1unshift:将参数添加到原数组开头,并返回数组的长度 var a = [1,2,3,4,5]; var b = a.unshift(-2,

2015-05-09 12:30:30 350

转载 JS字符串和数组操作方法(转载)

一、字符串的创建创建一个字符串有几种方法。最简单的是用引号将一组字符包含起来,可以将其赋值给一个字符串变量。var myStr = "Hello, String!";可以用双引号或单引号将字符串包含,但要注意,作为界定字符串的一对引号必须是相同的,不能混用。像var myString = “Fluffy is a pretty cat.’; 这样的声明就是非法的。允许使用两种引号,使得某些操作变得简

2015-05-09 10:06:44 1014

原创 拖拽原理-问题-解决办法

拖拽原理,拖拽问题,解决拖拽问题的兼容性

2015-05-05 20:10:47 498

原创 阻止浏览器默认行为

事件默认行为:当一个事件发生的时候浏览器自己会默认做的事情 怎么阻止? 当前这个行为是什么事件触发的,然后在这个事件的处理函数中使用return false; 例一:自定义右键菜单<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><style> d

2015-05-05 20:05:59 633

原创 有关键盘事件

onkeydown : 当键盘按键按下的时候触发 onkeyup : 当键盘按键抬起的时候触发event.keyCode : 数字类型 键盘按键的值 键值 ctrlKey,shiftKey,altKey :布尔值,当一个事件发生的时候,如果ctrl || shift || alt 是按下的状态,返回true,否则返回false例一:<!DOCTYPE HTML><html><head><m

2015-05-05 20:04:46 419

原创 事件绑定的第二种形式

<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>无标题文档</title><script>//给一个对象绑定一个事件处理函数的第一种形式//obj.onclick = fn;function fn1() { alert(th

2015-05-05 12:55:13 497

原创 关于事件冒泡

事件冒泡:当一个元素接受到事件的时候,会把他接收到的事件传播给他的父级,一直到顶层的window。 下面看例子: 例一:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body><input type="button" value="hah"></b

2015-05-05 12:53:57 404

原创 BOM的属性和方法

BOM : Browser Object Model 浏览器对象模型。 其实我们经常写的window对象就是浏览器的一个对象,下面通过一些例子了解BOM常见的属性和方法。 1.窗口的打开(open())和关闭(close()): 这两个方法有兼容性的问题,在不同的浏览器下表现不同 例一:<!DOCTYPE HTML><html><head><meta http-equiv="Conte

2015-05-05 12:52:01 864

原创 获取class函数的封装

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><script> window.onload=function(){ var oUl1=document.getElementById("ul1"); var arr=[];

2015-05-05 12:49:13 563

原创 元素的创建,插入,替换和删除

1.创建元素:document.createElement(标签名称) 2.插入元素:父级.appendChild(要添加的元素) 方法 追加子元素 3.在目标元素之前插入元素:父级.insertBefore(新的元素,被插入的元素) 方法 在指定元素前面插入一个新元素 在ie下如果第二个参数的节点不存在,会报错 在其他标准浏览器下如果第二个参数的节点不存在,则会以appendChild的形

2015-05-05 12:47:13 565

原创 offsetLeft,offsetTop,offsetWidth,offsetHeight的使用

元素.offsetLeft[Top]:只读属性,当前元素到定位父级的距离(偏移值),也可以理解成到当前元素的offsetParent的距离。1.如果当前元素和父级都没有定位情况:‘ 例一:<!DOCTYPE HTML><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

2015-05-04 20:05:33 478

原创 parentNode和offsetParent的使用

parentNode和offsetParent的使用

2015-04-30 08:46:14 3339

原创 firstChild,lastChild,NextSibling,previousSibling的使用

firstChild,lastChild,NextSibling,previousSibling的使用

2015-04-28 20:12:16 1532

原创 childNodes,children和noteType

childNodes,children和noteType的使用

2015-04-28 19:24:37 755

空空如也

空空如也

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

TA关注的人

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