分类：WEB开发

2015
01-30

web前端工程师在移动互联网时代里的地位问题 HOT

支付宝十周年推出了一个新产品：支付宝的十年账单，我也赶个时髦查看了一下我的支付宝十年账单，哎，感慨自己真是太屌丝了，不过这只是说明我使用淘宝少了，当我大规模网上购物时候，我很讨厌慢速的快递，所以我大部分消费都贡献给了像京东这样具有火箭般快递速度的电子商城了。不过在支付宝十年账单里，有个统计数据引起了我的危机意识，在中国一些偏远或者是经济欠发达的省份，电子购物在居民的全部消费里的占比比发达地区... 继续阅读 >
2015
01-28

HTTP响应报文与工作原理详解 HOT

超文本传输协议(HypertextTransferProtocol，简称HTTP)是应用层协议。HTTP是一种请求/响应式的协议，即一个客户端与服务器建立连接后，向服务器发送一个请求;服务器接到请求后，给予相应的响应信息。HTTP请求报文HTTP请求报文由请求行、请求头部、空行和请求包体4个部分组成，如下图所示：下面对请求报文格式进行简单的分析：请求行：请求行由方法字段、URL字段和HTTP协议版本字段3个部分组成，他们之间使用空... 继续阅读 >
2015
01-27

HTML5 History API 实现无刷新更新地址栏URL

History是有趣的，不是吗？在之前的HTML版本中，我们对浏览历史记录的操作非常有限。我们可以来回使用可以使用的方法，但这就是一切我们能做的了。但是，利用HTML5的HistoryAPI，我们可以更好的控制浏览器的历史记录了。例如：我们可以添加一条记录到历史记录的列表中，或者在没有刷新时，可以更新地址栏的URL。为什么介绍HistoryAPI？在这篇文章中，我们将了解HTML5中HistoryAPI的来源。在此之前，我们经常使用散列值来... 继续阅读 >
2015
01-27

js本地存储解决方案——localStorage与userData

WEB应用的快速发展，是的本地存储一些数据也成为一种重要的需求，实现的方案也有很多，最普通的就是cookie了，大家也经常都用，但是cookie的缺点是显而易见的，其他的方案比如：IE6以上的userData，Firefox下面的globalStorage，以及Flash的本地存储，除了Flash之外，其他的几个都有一些兼容性的问题。sessionStorage与localStorageWebStorage实际上由两部分组成：sessionStorage与localStorage。sessionStorage用于本地存储一... 继续阅读 >
2015
01-27

CSS 强制换行和超出隐藏实现

一、强制换行word-break:break-all;只对英文起作用，以字母作为换行依据。word-wrap:break-word;只对英文起作用，以单词作为换行依据。white-space:pre-wrap;只对中文起作用，强制换行。word-break:break-all和word-wrap:break-word都是能使其容器如div的内容自动换行，它们的区别在于：1、word-break:break-all假设div宽度为450px，它的内容就会到450px自动换行，如果该行末端有个很长的英文单词，它会把单词截断... 继续阅读 >
2015
01-27

AJAX 跨域请求的解决办法：使用 JSONP获取JSON数据

由于受到浏览器的限制，ajax不允许跨域通信。如果尝试从不同的域请求数据，会出现安全错误。如果能控制数据驻留的远程服务器并且每个请求都前往同一域，就可以避免这些安全错误。但是，如果仅停留在自己的服务器上，Web应用程序还有什么用处呢？如果需要从多个第三方服务器收集数据时，又该怎么办？理解同源策略限制同源策略阻止从一个域上加载的脚本获取或操作另一个域上的文档属性。也就是说，受到请求的URL的域必须与当前... 继续阅读 >
2015
01-27

CSS中设置margin:0 auto; 水平居中无效的原因分析

很多初学制作网页的朋友，可能会遇到的一个常见问题，就是在CSS中加了margin:0auto;却没有效果，不能居中的问题，margin:0auto;的意思就是：上下边界为0，左右根据宽度自适应，其实就是水平居中的意思，在这里说两个典型的错误引起的不能居中的问题：1、没有设置宽度<divstyle="margin:0auto;"></div>看看上面的代码，根本没有设置DIV的宽度，如何根据宽度自适应呢？新手比较容易忽略的问题。2、没声明DOCTYPE1）DOCTYPE... 继续阅读 >
2015
01-25

使用HTML5中postMessage实现Ajax中的POST跨域问题 HOT

HTML5中提供了在网页文档之间相互接收与发送信息的功能。使用这个功能，只要获取到网页所在窗口对象的实例，不仅仅同源(域+端口号)的web网页之间可以互相通信，甚至可以实现跨域通信。浏览器支持程度：IE8+，firefox4+，chrome8+ opera10+1.首先，要想接收从其他的窗口发过来的消息，就必须对窗口对象的message事件进行监听，如下代码：window.addEventListener(“message”,function(){},false);2.其次，需要使用wi... 继续阅读 >
2015
01-23

微软是时候把IE浏览器开源了

在世界主流Web浏览器的发展历史中，微软的IE浏览器曾经独占鳌头：市场占有率高达98%以上。不过随着FireFox和Chrome的快速崛起，微软IE浏览器的份额一路下降，如何拯救IE浏览器？日前，国外媒体提出了自己的看法。以下为文章全文：苹果公司的Safari浏览器是由一个开放源代码的Webkit引擎和闭源的外壳组成；谷歌的Chrome浏览器是由开放源码的渲染引擎和部分闭源的组件组成。Opera浏览器也已经基于开源的blink打造。M... 继续阅读 >
2015
01-23

HTML5会是下一个风口吗？

2014年10月底，W3C（万维网联盟）正式宣布HTML5正式定稿，科技圈就像发现了可以打破谷歌、苹果所统领的原生APP世界的方法，发表了很多宣讲HTML5将真正开始颠覆原生（Native）App的文章，也开始着力发展HTML5，开始抢占HTML5这个未来的风口。那么HTML5为成为下一个风口吗？HTML5的定稿真正可以颠覆目前火热的原生APP吗？个人认为，存在以下的机遇。1.苹果、谷歌的态度苹果、谷歌所代表的iOS、安卓系统，占据了移... 继续阅读 >
2015
01-20

2014 年最热门的国人开发开源软件 TOP 100

不知道从什么时候开始，很多一说起国产好像就非常愤慨，其实大可不必。做开源中国六年有余，这六年时间国内的开源蓬勃发展，从一开始的使用到贡献，到推出自己很多的开源软件，而且还有很多软件被国外的认可。中国是开源不可忽视的力量。而我们这个榜单也是从这些国人开发、主要参与开发或者基于国外开源软件进行改进并形成独立版本的软件中，根据该软件的访问、收藏、下载等多个角度，从而得出前100名最受欢迎的开源软件。... 继续阅读 >
2015
01-20

设计优秀API七大要诀

越来越多的公司加入OpenAPI行列，那么，设计师该如何设计出功能目标明确、拥有良好用户体验且据吸引力的API呢？要知道，良好的接口设计可以降低系统各部分之间的相互依赖，提高组成单元的内聚性，降低组成单元间的耦合度，从而提高系统的维护性和稳定性。一个超棒的API必定经过一番精心设计，肯花大量时间、站在用户角度思考问题，这样用户使用起来才会事半功倍。那么，这样的API需要具备什么样的条件呢？有的放... 继续阅读 >
2015
01-16

纯干货：三分钟，读懂互联网运营

导读在近几年，我面对最多的一个对话场景和问题总是这样的—：问：你是做什么工作的？答：我在互联网圈做运营。再问：什么是运营？运营到底是做什么的？……你会发现，要试图去回答“什么是运营”这样的问题，总是不太容易。那么，我们先来回答那个更容易回答也更落地的问题——运营具体都会做些什么？从基础的层面来讲，运营要关注和涉及的工作通常包括了如下三方面——拉新、留存、促活。所谓拉新，就是为你的产品带来新... 继续阅读 >
2015
01-14

前方高能反应！设计师最常见的五个设计误区

走的路多了，总会知道哪里有坑，哪里有捷径。即使是资深的设计师也难免犯错，今天这篇文章就是Facebook设计主管JulieZhuo的经验之谈，根据自己的工作经验，总结设计师最容易踏错的5个设计误区。在学习的道路上难免犯错，至少对我而言，这样的事情并不鲜见。幸运的是，生在互联网快速发展的时代，我们可以轻松地让错误暴光在互联网的聚光灯之下，让问题无所遁形，试图通过一同探讨，解决问题。1、过于约束的设计... 继续阅读 >
2015
01-13

IE6 是时候说“再见”了！

十年前，一个浏览器诞生了，它的名字是InternetExplorer6（以下简称IE6），它伴随我们度过了难忘的网上时光。十年过去，在拥抱全新网络开发标准的今天，是时候和IE6说再见了。2011年度浏览器奥西卡颁奖典礼正式开幕。在颁奖现场，评委向IE6授予“浏览器终生成就奖”，以表彰它为浏览器世界做出的卓越的贡献。与网友相伴十年之际，IE6感慨万分。心情激动的它接过奖杯走到话筒前，开始了自己第一次也是最后一次的激... 继续阅读 >
2015
01-12

响应式设计的现状与趋势 HOT

从2012年开始到2014年，各大家对Web设计的趋势预测中，都提到响应式设计；2015年网页设计趋势预测中，响应式仍在继续。这个经历了几年依然大热的响应式，在过去的几年里，快速巩固了自己的地位，并掀起了一股网页设计新标准的浪潮。这里本人基于一些资料文献及自己的陋见，谈谈响应式设计的一些现状和趋势。源起2010年5月，伊桑.马科特（EthanMarcotte）在“AListApart”写了一篇开创性的文章（题为“ResponsiveWeb... 继续阅读 >
2015
01-09

FckEditor(CKEditor)配置详细教程

CKEditor的只配置文件被命名为“config.js”，可以在安装目录里面找到。所有的配置选项你都可以在http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html 里面查看第一种配置方法：在使用的页面里面配置，比如：CKEDITOR.replace('editor1',{toolbar:'Basic',uiColor:'#9AB8F3'});第二种方法：可以直接在配置文件config.js里面配置，这个文件默认就是空的，你如要更改配置... 继续阅读 >
2015
01-09

2015年Web用户体验的5大不同点 HOT

在2015年我们或许会看到：Web内容将更趋于清洁简单；更多的非电商企业将采取电商的技术，为顾客推荐预测内容；“卡片设计”在这一年将会流行；越来越多的企业会采用“Sopro”应用；智能手表需作改变，否则注定失败。在过去的一年，我们见证了Uber的崛起、Apple加入了可穿戴设备的竞赛中、以及诸如Facebook收购Whatapp这类大的并购事件。那么在2015年我们将看到哪些巨大的改变？这里列出了五个对未来的预测：1.更清洁、... 继续阅读 >
2015
01-09

7款绚丽的jQuery/HTML5动画及源码 HOT

jQuery是一款非常流行的JavaScript框架，利用jQuery，我们可以制作简单的动画效果，但是结合HTML5，这样的动画效果就会变得更加出彩。本文分享了7款jQuery结合HTML5的动画以及源码下载。1、HTML5/SVG实现布谷鸟时钟动画这是一款非常有意思的HTML5动画，它是一个老式的时钟，有布谷鸟报时，情侣的浪漫舞蹈。在线演示源码下载2、HTML5/CSS3实现图片倒影3D效果这款应用主要利用了CSS3的transform属性实现... 继续阅读 >
2015
01-08

JavaScript依赖注入的实现思路

.article-entrypre{margin:15pxauto;font:12px/20px'couriernew';border:1pxsolid#ddd;border-left-width:4px;background:#fbfbfb;padding:10px15px;}如今各个框架都在模块化，连前端的javascript也不例外。每个模块负责一定的功能，模块与模块之间又有相互依赖，那么问题来了：javascript的依赖注入如何实现？（javascript的依赖注入，各大框架都有相应的实现，这里只学习实现思路）如下需求：假设已经有定义好的服务模... 继续阅读 >
2015
01-07

赵望野：前端工程师的困惑 推荐

赵望野，现任豌豆荚Front-endTeamLead。他2011年加入豌豆实验室，曾负责豌豆荚Windows版的前端架构设计和主要开发工作，以及Front-endInfrastructure的研发工作。当豌豆荚从一家初创公司成长为一家获得上亿美元投资的企业的时候，赵望野也在他的职业道路上不断成长着。随着业界对前端工程师价值的逐渐认可，越来越多的人才开始进入这个领域，而赵望野却认为这一切都“有点晚了”。他的困惑来源于变化的环境和前端工程... 继续阅读 >