发表于   |   分类于   |  

关于移动Web开发的一些坑和技巧总结：

「H5」这个词汇虽然是不专业的，但在国内环境里最能让非技术人员理解的叫法
通常移动端页面被俗称「H5」页面，，我们应该关心的是沟通效率和成本
因此下文所「H5」即移动终端设备上的WEB页面。

1. 关于PPI

　PPI全称为Pixel Per Inch，译为每英寸像素取值，更确切的说法应该是像素密度，也就是衡量单位物理面积内拥有像素值的情况。PPI中的pixel指的应该是物理像素。
显示器上的像素我们就称之为物理像素(physical pixel)或者设备像素(device pixel)。
CSS像素从来都只是一个相对值。在高PPI的设备上，CSS像素甚至在默认状态下就相当于多个物理像素的尺寸。

阅读全文 »

发表于   |   分类于   |  

日本服务器SS账号，不了解请移动鼠标到右上角，关闭浏览器，若你了解，请继续往下看：
Google 查资料无压力，YouTube 1080P 无卡顿，中国联通白天速度可达 15000 Kbps，直观感受跟访问百度的速度差不多，作为科技界的你是不是很开森啊！你会发现 Instagram 复活了，tumblr 也复活了，作为设计师的你是不是很开森啊！目前仅两人使用，感觉有点奢侈，于是乎如果您需要，也可领个账号，请看以下代码：

var Price = {
    "1GB": {
        "原价"："¥10",
        "促销优惠": "0%",
        "现价": "¥10",
        "类型": "1年内不清零，不限时"
    },
    "3GB": {
        "原价"："¥30",
        "促销优惠": "20%",
        "现价": "¥24",
        "类型": "1年内不清零，不限时"
    },
    "5GB": {
        "原价"："¥50",
        "促销优惠": "30%",
        "现价": "¥35",
        "类型": "1年内不清零，不限时"
    },
    "10GB": {
        "原价"："¥100",
        "促销优惠": "40%",
        "现价": "¥60",
        "类型": "1年内不清零，不限时"
    }
}

读懂 JSON 文件，恭喜您，暴露了作为一个程序猿的身份~
当然为了更好的体验，暂仅限三人购买，
你送我三分之一杯星巴克，我带你傲游整个世界。
戳这里免费体验: http://ss.jandou.com
戳这里直接注册: http://ss.jandou.com/user/register.php
戳这里获取邀请码: http://ss.jandou.com/code.php （没有邀请码时，可以加微信索取）

发表于   |   分类于   |  

月中的 12 号是使用 Wordpress 第六个年头的日子，其实很感谢 Wordpress 这个开源 CMS Blog 系统，它让我学会了搭建一个网站，而不是自己去搞个轮子，我主张的是如何能把这件事先做出来，比如说我要做一个网站，我是不会去拿《PHP 编程技术》、《JavaScript权威指南》、《精通 CSS》这些来慢慢学，而是直接去想我要在最短时间内做出这个网站，自然顺藤摸瓜到开源软件了，这是一种学习路径，当然了这样一来技术底子就没那么强，不过对于快速学习来说，这是一种很好的方式，对于我而言。

今天把老博客的数据整理了下，发现这么多年来，我还真没写出个什么出来，于是就筛选了几篇文章搬迁到新的博客来，毕竟还是有念想，算是六年来的一个见证。

阅读全文 »

发表于   |   分类于   |  

<< 访问 Wow!Ubuntu

NOTE: This is Simplelified Chinese Edition Document of Markdown Syntax. If you are seeking for English Edition Document. Please refer to Markdown: Syntax.

声明： 这份文档派生(fork)于繁体中文版，在此基础上进行了繁体转简体工作，并进行了适当的润色。此文档用 Markdown 语法编写，你可以到这里查看它的源文件。「繁体中文版的原始文件可以查看这里 。」–By @riku

注： 本项目托管于 GitCafe上，请通过”派生”和”合并请求”来帮忙改进本项目。

阅读全文 »

发表于   |   分类于 ，   |  

[Array] n. 数组，阵列；排列，列阵；大批，一系列；衣服

数组是类似列表的特殊对象，一个存储元素的线性排列，元素可以通过索引来存取，索引一般来说就是数字，用来计算元素之间存储位置的偏移量，这个偏移量实际上就是对象里称呼的属性。
在原型中提供了遍历以及改变其中元素的很多方法。
数组的长度及其中元素的类型都是不固定的。
因为数组的长度可读可写，有时数组中的元素也不是在连续的位置，所以 JavaScript 数组不一定是密集的。
通常情况下，这是一些方便的特性；如果这些特性不适用于你的特定使用场景，你可以考虑使用固定类型数组。

阅读全文 »

发表于   |   分类于   |  

概述

每个项目的根目录下面，一般都有一个package.json文件，定义了这个项目所需要的各种模块，以及项目的配置信息（比如名称、版本、许可证等元数据）。npm install命令根据这个配置文件，自动下载所需的模块，也就是配置项目所需的运行和开发环境。

下面是一个最简单的package.json文件，只定义两项元数据：项目名称和项目版本。

{
  "name" : "xxx",
  "version" : "0.0.0",
}

上面代码说明，package.json文件内部就是一个JSON对象，该对象的每一个成员就是当前项目的一项设置。比如name就是项目名称，version是版本（遵守“大版本.次要版本.小版本”的格式）。

阅读全文 »

发表于   |   分类于   |  

前端与服务端数据交互时，涉及到跨域的一些问题。JavaScript出于安全的考虑，禁止了跨域调用其他页面的对象，也即同源策略限制了一个源（origin）中加载文本或脚本与来自其它源（origin）中资源的交互方式。

什么是跨域？

如果两个页面拥有相同的协议（protocol），端口（如果指定），和主机，那么这两个页面就属于同一个源（origin），JavaScript 允许这种同源页面的数据互相通信。

阅读全文 »

发表于   |   分类于   |  

移动端领域，常常会去判断终端类型，然后去执行相应的动作。
通过 Javascript 去判断客户端是否是iOS或Android：

//以下代码片段是通过 Javascript 去判断客户端是否是iOS或Android：
var u = navigator.userAgent,
    isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, // Android 终端
    isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), // iOS 终端（第 1 种方法）
    isiOSx = u.indexOf('iPhone') > -1 || u.indexOf('iPad') > -1; //iOS 终端（第 2 种方法）

//以下代码是检查是否是移动端（Mobile）、iPad、iPhone、WeChat、QQ
var browser={
    versions:function(){
        var u = navigator.userAgent, app = navigator.appVersion;
        return {
            trident: u.indexOf('Trident') > -1, //IE内核
            presto: u.indexOf('Presto') > -1, //Opera内核
            webKit: u.indexOf('AppleWebKit') > -1, //Safari、Chrome...
            gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,//FireFox
            mobile: !!u.match(/AppleWebKit.*Mobile.*/), // 是否为移动终端
            ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //iOS 终端
            android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //Android 终端
            iPhone: u.indexOf('iPhone') > -1 , //是否为iPhone或者QQHD浏览器
            iPad: u.indexOf('iPad') > -1, //是否iPad
            webApp: u.indexOf('Safari') == -1, //是否web应该程序，没有头部与底部
            weixin: u.indexOf('MicroMessenger') > -1, //是否微信
            qq: u.match(/\sQQ/i) == " qq" //是否QQ
        };
    }(),
    language:(navigator.browserLanguage || navigator.language).toLowerCase()
}

//调用方法：
if(browser.versions.trident){ alert("is IE"); }//判断是否IE内核
if(browser.versions.webKit){ alert("is webKit"); }//判断是否webKit内核
if(browser.versions.mobile||browser.versions.android||browser.versions.ios){ alert("移动端"); }//判断是否移动端

//检测浏览器语言:
currentLang = navigator.language;   //判断除IE外其他浏览器使用语言
if(!currentLang){  //判断IE浏览器使用语言
    currentLang = navigator.browserLanguage;
}
alert(currentLang);

发表于   |   分类于   |  

一道JS题目的解析

var A = (function() {
	function Person(name) {
		this.name = name;
	}

	var m = function() {
		return "Hello " + this.name;
	};

	Person.prototype.getGreeting = m;

	return Person;
})();

// After this line, what would you write to call into the above code and have it return “Hello Edgar”?
// Answer:
var edgar = new A('Edgar');
edgar.getGreeting();// Hello Edgar

变量A 被赋值成一个自执行函数，最终return出Person这个构造函数，因此A被指引到构造函数Person。
构造函数Person有一个属性name，name由构造函数的参数name传入，另外它还有函数指向变量m，然后m赋给了Person的原型属性getGreeting。
因此要打印出『Hello Edgar』，需要用参数传入Edgar，再调用原型链上的getGreeting方法。

发表于   |   分类于   |  

优化的意义

现阶段PC的性能绝大多数情况是过剩的，但移动端性能就参差不齐了，因此对移动端 H5 页面进行精细的性能优化是极其重要的。
移动端的WEB页面本身渲染性能差于Native的APP，尽管产品的功能，不关注性能优化，将极大的影响WEB页面的体验。

用户感知

当用户能够在1-2秒内打开H5页面，看到信息的展示，或者能够开始进行下一步的操作，用户会感觉速度还好，可以接受；而页面如果在2-5秒后才进入可用的状态，用户的耐心会逐渐丧失；而如果一个界面超过5秒甚至更久才能显示出来，这对用户来说基本是无法忍受的，也许有一部分用户会退出重新进入，但更多的用户会直接放弃使用。

阅读全文 »