Javascript on ZRJ | 学习笔记

javascript 计算当月当季当年的总天数和已过天数

Thu, 27 Apr 2017 10:36:04 +0800

function q(now, timePeriodType) {
    console.log('---------');
    console.log(now);
    console.log(timePeriodType);
    var time_process_value = 0;
    var time_process_total_value = 0;
    if (timePeriodType == '月') {            
        time_process_value = now.getDate() - 1;
        time_process_total_value = new Date(now.getFullYear(), now.getMonth()+1, 0).getDate();
    } else if (timePeriodType == '年') {
        var start = new Date(now.getFullYear(), 0, 1);
        var diff = now - start;
        var oneDay = 1000 * 60 * 60 * 24;
        time_process_value = Math.floor(diff / oneDay);
        var end = new Date(now.getFullYear()+1, 0, 1);
        var diffend = end - start;
        time_process_total_value = Math.floor(diffend / oneDay);
    } else if (timePeriodType == '季') {
        console.log('--季');
        var currentMonthIndex = now.getMonth(); // 从零开始
        var currentQuarterIndex = Math.floor(currentMonthIndex / 3); // 从零开始
        console.log('currentMonthIndex'+currentMonthIndex+'currentQuarterIndex'+currentQuarterIndex);
        var quarterBeginDate = new Date(now.getFullYear(), currentQuarterIndex*3, 1);
        var quarterEndDate = new Date(now.getFullYear(), (currentQuarterIndex+1)*3, 1);
        console.log(quarterBeginDate);
        console.log(quarterEndDate);
        var oneDay = 1000 * 60 * 60 * 24;
        var diff = now - quarterBeginDate;
        var diffend = quarterEndDate - quarterBeginDate
        time_process_value = Math.floor(diff / oneDay);
        time_process_total_value = Math.floor(diffend / oneDay);
    }
    console.log(time_process_value);
    console.log(time_process_total_value);
}
q(new Date(), '月');
q(new Date(), '季');
q(new Date(), '年');
q(new Date(2017, 0, 1), '月');
q(new Date(2017, 0, 1), '季');
q(new Date(2017, 0, 1), '年');
q(new Date(2017, 11, 31), '月');
q(new Date(2017, 11, 31), '季');
q(new Date(2017, 11, 31), '年');

javascript 闭包实现斐波那契数列生成器

Wed, 15 Mar 2017 17:53:58 +0800

几个点，一个是生成器 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Iterators_and_Generators 另外一个是闭包

function fibo() {
    var a = 0;
    var b = 1;
    function gen() {
        var res = (a < b) ? a : b;
        if (a < b) {
            a = a + b;
        } else {
            b = a + b;
        }
        return res;
    }
    return gen;
}
var fibogen = fibo();
for (var i = 1; i < 10; i++) {
    console.log(fibogen());
}

输出如下

那如果不用闭包呢，那就是上面贴的那个文章的里面的 yield 了

==============

2017-3-15 20:50:03 一个更简单的

function fibo() {
    var a = 0;
    var b = 1;
    function gen() {
        var res = a;
        a = b;
        b = res + b;
        return res;
    }
    return gen;
}
var fibogen = fibo();
for (var i = 1; i < 10; i++) {
    console.log(fibogen());
}

javascript 取得当前 yyyymmdd

Sun, 10 Jul 2016 12:08:33 +0800

这里有一个答案，http://stackoverflow.com/questions/3066586/get-string-in-yyyymmdd-format-from-js-date-object

Altered piece of code I often use:

Date.prototype.yyyymmdd = function() { var mm = this.getMonth() + 1; // getMonth() is zero-based var dd = this.getDate();

return [this.getFullYear(), !mm[1] && ‘0’, mm, !dd[1] && ‘0’, dd].join(’’); // padding };

var date = new Date(); date.yyyymmdd();

赞同高达 300 多票，然而，请注意，在 2016.7.10 时，这个函数会输出：201607010

所以，估计坑死一片爹

下面的这个答案：http://stackoverflow.com/questions/3066586/get-string-in-yyyymmdd-format-from-js-date-object/16714931#16714931

才是对的

====================

2016-7-11 00:27:04 上述也有问题，iso 时间是伦敦时间

看这里 http://stackoverflow.com/questions/23593052/format-javascript-date-to-yyyy-mm-dd/23593099#23593099

Chrome 中印象笔记悦读插件的问题

Tue, 10 Feb 2015 21:00:34 +0800

印象笔记有一个 Chrome 插件，叫做悦读，可以过滤页面上的杂乱元素，得到一个清爽的纯内容视图，并且可以剪辑到印象笔记中，是个很好的插件。

然而有一个问题，例如这个页面，http://www.techxue.com/techxue-12450-1.html，摘取一段话

微信由腾讯公司于2011年1月推出，到2013年第4季度，注册用户量已经突破6亿，月活跃用户数达到3.55亿，是亚洲地区拥有最大用户群体的移动即时通讯软件。它先后实现了公众平台、朋友圈、消息推送、钱包等功能。现在的微信拥有巨大的话语权，近期它与支付宝的对决，更是霸气侧漏。那么，这么高逼格的平台是如何横空出世的呢。请往下看。

这段话在阅读器视图中变成了

微信由腾讯公司于月推出，到季度，注册用户量已经突破亿，月活跃用户数达到亿，是亚洲地区拥有最大用户群体的移动即时通讯软件。它先后实现了公众平台、朋友圈、消息推送、钱包等功能。现在的微信拥有巨大的话语权，近期它与支付宝的对决，更是霸气侧漏。那么，这么高逼格的平台是如何横空出世的呢。请往下看。

很明显，数字都不见了，看了一眼源代码，究其原因，是因为代码的 span 标签有 lang 属性

<font size="3">
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">微信由腾讯公司于</span>
	<span lang="EN-US" style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">2011</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">年</span>
	<span lang="EN-US" style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">1</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">月推出，到</span>
	<span lang="EN-US" style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">2013</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">年第</span>
	<span lang="EN-US" style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">4</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">
		季度，注册
		<a href="http://techxue.com/yonghu/" target="_blank" class="relatedlink">用户</a>量已经突破
	</span>
	<span lang="EN-US" style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">6</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">亿，月活跃用户数达到</span>
	<span lang="EN-US" style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">3.55</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">
		亿，是亚洲地区拥有最大用户群体的移动即时通讯软件。它先后实现了公众平台、朋友圈、消息推送、钱包等功能。现在的微信拥有巨大的话语权，近期它与
		<a href="http://www.techxue.com/dutu/zhifu/" target="_blank" class="relatedlink">支付</a>宝的对决，更是霸气侧漏。那么，这么高逼格的平台是如何横空出世的呢。请往下看。
	</span>
</font>

我猜这是某个富文本编辑工具加上的，那么自然想到，如果把这些差异抹平，是不是问题就可以解决，怎么去掉呢，jQuery 自然就是一个办法，那么首先的问题就是怎么引入 jQuery，这里说了，http://stackoverflow.com/questions/7474354/include-jquery-in-the-javascript-console

var jq = document.createElement('script');
jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
// ... give time for script to load, then type.
jQuery.noConflict();

然后去掉 span 的 lang 其实就是一行代码的事情

$("span[lang]").removeAttr("lang")

完成之后的效果就是

<font size="3">
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">微信由腾讯公司于</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">2011</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">年</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">1</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">月推出，到</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">2013</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">年第</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">4</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">
		季度，注册
		<a href="http://techxue.com/yonghu/" target="_blank" class="relatedlink">用户</a>量已经突破
	</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">6</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">亿，月活跃用户数达到</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">3.55</span>
	<span style="font-family: 微软雅黑, sans-serif; line-height: 200%; text-indent: 21pt;">
		亿，是亚洲地区拥有最大用户群体的移动即时通讯软件。它先后实现了公众平台、朋友圈、消息推送、钱包等功能。现在的微信拥有巨大的话语权，近期它与
		<a href="http://www.techxue.com/dutu/zhifu/" target="_blank" class="relatedlink">支付</a>宝的对决，更是霸气侧漏。那么，这么高逼格的平台是如何横空出世的呢。请往下看。
	</span>
</font>

本来一心以为这样就搞掂了，但是一启动阅读器视图，还是那个鸟样，看来还是有什么地方没有搞好，后续继续折腾。

chrome 扩展开发二三事

Tue, 10 Jun 2014 21:28:34 +0800

chrome 扩展可以通过 chrome.webRequest.onBeforeSendHeaders 回调来修改请求头，修改请求头部字段会在 TCP 连接发起之后，也就是这个时候 URL 已经是不能变的，这个接口也可以修改 URL，会导致一次重定向，不过貌似重定向之后携带的 cookie 会有些异常，没有细跟
那么，自然的，会想到一个问题，怎么获取请求的响应呢，对于这个问题，答案是，一般情况下，chrome 扩展无法获取请求的响应，参看，http://stackoverflow.com/questions/18534771/chrome-extension-how-to-get-http-response-body
那么不一般的情况呢，我们需要通过 chrome.devtools.network.onRequestFinished 来监听响应报文，但是，这个接口只能在 dev tools 中使用，所谓 dev tools，就是说，你需要自定义一个控制台面板，就是按下 F12 之后出来的那些 Elements, Network, Console 那一排，在那后面，自己追加一个，参看，http://stackoverflow.com/questions/10393638/chrome-extensions-other-ways-to-read-response-bodies-than-chrome-devtools-netw
写一个自己的 panel 其实不难，还是 html javascript css 那一套，通过 chrome.devtools.panels.create 来创建自己的 panel
问题是一般情况下，我们把调试信息打到 console.log 里面，这个是调试一般页面的好方法，但是，如果我们本身就要调试一个 console，那么怎么办呢，http://codemadesimple.wordpress.com/2012/11/15/debug-chrome-dev-tools-panel/，这里提供了一个思路，把 dev page 写成 options page，然后用 options page 来调，但是，如果我们的 dev page 是跟当前页面紧密耦合的，例如，我们需要调试当前页面的响应的话，这种情况，他的方法貌似就不奏效了
http://stackoverflow.com/questions/11103780/console-log-for-chrome-devtools-api，这里有一些其他的讨论，主要是重载 console 的，但是在我这儿试了试，貌似不是很奏效
所以我最后的办法是 alert
另外一个小 tips，对于 json 格式的 alert，会打 object，这个其实毛线用都没有，我也知道他是一个 object 啊，这个时候，可以 alert(JSON.stringify(xxx))，可以把 json 内容展开
如果想要在插件中发起跨域的 ajax 请求，记得在 manifest.json 中声明相关的权限
对于旧版本的 chrome，例如 chrome 31，即使你声明了跨域的权限，也没法在 dev page 中发起跨域的请求，background page 中可以
所以就需要曲线救国，使用 chrome 扩展的模块间通讯接口，把需要发起的请求包装送到可以发起请求的地方去发送，收到回复之后再送回来，相关的接口是 chrome.runtime.sendMessage 和 chrome.runtime.onMessage.addListener
chrome.runtime.onMessage.addListener 的回调函数中有一个 sendResponse 的回复用的函数，如果需要异步的使用这个函数，记得 return true，这是个坑，而且不容易发现，官方是这么说的，runtime.onMessage: The chrome.runtime.onMessage listener must return true if you want to send a response after the listener returns
近日，google 开始推送 chrome 35.0.1916.114，从这个版本开始，chrome 不再允许用户自行安装插件
上有政策下有对策，对策总结起来不外乎，不升级 chrome，把插件发布到 store，让用户用开发者模式运行
另外还有一个大杀器，https://support.google.com/chrome/a/answer/188453?hl=en，这个大杀器我还没怎么深入研究，稍后再看看这个好不好使
感言，chrome 已经不是一个浏览器，而像是一个操作系统了

-——————–

2014-6-13 11:22:07 update

http://tieba.baidu.com/p/1740161948，这里提到了用 ad block plus 作为例子的企业定制安装方式
http://dev.chromium.org/administrators/policy-list-3#ExtensionInstallForcelist，这里是 google 官方给出的一些安装说明
https://developer.chrome.com/extensions/hosting.html，这里说明了安装文件的托管方式
但是当我尝试使用这种方式进行安装的时候一直安装不上去，阅读了文档，提到 content type，也正确设置了，还是不行
于是我尝试把 ad block plus 的安装文件部署到自己的环境上，是可以安装的，于是我开始认为是我的 crx 打包的有问题
后来查到了这里，http://productforums.google.com/forum/#!topic/chrome/ayfF5WaeQqc，同学们在反应 web store 的扩展安装不上去，从这个帖子里面找到一个叫 chrome debug 的 log 文件
http://www.chromium.org/for-testers/enable-logging，这里说明了怎么打开 log
从 log 中翻查，终于找到原因，原来是扩展的 id 不同，在开发者模式下，我看到一个 id 是 a，但是，打包之后，扩展的 id 变成了 b，跟声明的不符，所以安装不上，哇靠，要是不看日志，鬼知道 id 会不匹配啊
https://developer.chrome.com/extensions/packaging，这里说了一些打包时候的注意事项
https://developer.chrome.com/extensions/autoupdate，这里说明了一些关于扩展自动升级的事项
旧版本的 chrome，例如 31，在企业安装的时候，会比较慢，一般需要等 1-3 分钟才会发起请求去拉安装文件，新版本的就快很多，一般一启动就去拉了，不知道为什么
chrome 31 的插件安装缓慢跟版本本身有关，跟网络环境无关，这个没办法

-———————–

2014-6-19 10:26:28 update

在线的 javascript 代码压缩和混淆工具有，http://closure-compiler.appspot.com/home，http://marijnhaverbeke.nl/uglifyjs，http://ganquan.info/yui/

历史评论

tonyseek (2014-06-14 16:21:10):

“修改请求头部字段会在 TCP 连接发起之后，也就是这个时候 URL 已经是不能变的” 似乎这个时候 HTTP 请求还没有建立，所以虽然 TCP 连接已建立，但是修改 Host Name 和 URL 的 Path 还是可行的吧？未亲测。

ZRJ (2014-06-16 10:56:40):

嗯，修改 url 的那个方式我没有细跟，原因是当时修改了 url 之后重新带上的 cookie 貌似有问题，所以就用了修改请求头其他字段的方式，至于说重新发起 tcp，我猜可能是 chrome 为了防止修改之后的 url 跟修改之前的 url 不是同一个目标机器上的，所以才会弃用原来的 tcp 连接而发起重新的 tcp 连接

dahaijiang (2014-06-20 09:50:15):

强大呀！

jQuery 动画二三事

Tue, 10 Jun 2014 09:23:54 +0800

对 table 的动画容易引起诡异的效果，参看，http://stackoverflow.com/questions/5489829/sliding-up-or-down-an-entire-html-table-using-jquery-doesnt-work

对 slide 的动画可能出现跳跃，参看，http://stackoverflow.com/questions/1335461/jquery-slide-is-jumpy

一个简单的监控网页变化的方法

Wed, 06 Nov 2013 11:49:18 +0800

最近遇上一个小的实际需求：一个页面上有些许表格，我们需要监控这个页面，当表格的内容有变化的时候，及时通知我们。需求比较小，要求是用尽量简单的方式来实现。另外，这个页面是要求登陆态的。

想了想，大约没有什么现成的解决方案，那么打算自己写代码来实现。

自然的想起脚本语言来，首先尝试了 python，在 python 2 自带的 urllib2 的帮助下，抓取页面这个步骤还是比较简单的，几行代码就可以完成功能

url = "http://..."
headers = {"Cookie" : "..."}
request = urllib2.Request(url, None, headers)
response = urllib2.urlopen(request)
html = response.read()

但是在解析 html 的时候出现了问题。

简单搜索一下，发现 python 用来解析 html 的，有自带的 HTMLParser，以及第三方库，beautiful soup，第三方库下载之后简单的尝试安装了一下，没有安装成功，快速的放弃了，转而查看 HTMLParser 的文档，这个东西其实也还是蛮强大的，但是写起来比较复杂，需要用一种状态驱动的方式去写接口，样例的代码可以看到这里，http://cloudaice.com/yong-pythonde-htmlparserfen-xi-htmlye-mian/

from HTMLParser import HTMLParser import urllib import sys class parselinks(HTMLParser): def __init__(self): self.data=[] self.href=0 self.linkname=’’ HTMLParser.__init__(self) def handle_starttag(self,tag,attrs): if tag ==‘a’: for name,value in attrs: if name == ‘href’: self.href=1 def handle_data(self,data): if self.href: self.linkname+=data def handle_endtag(self,tag): if tag==‘a’: self.linkname=’’.join(self.linkname.split()) self.linkname=self.linkname.strip() if self.linkname: self.data.append(self.linkname) self.linkname=’’ self.href=0 def getresult(self): for value in self.data: print value if __name__=="__main__": IParser = parselinks() IParser.feed(urllib.urlopen(“http://www.python.org/index.html").read()) IParser.getresult() IParser.close()

这样虽然也可以完成任务，但是还是略繁琐了。

而问题并没有到此结束，接下来遇到的问题是，当发现变化的时候，怎么通知到我们呢。假设我们都在电脑前坐着，但是需要干其他事情，而这个 python 脚本是基于终端的，那么，我们就只能把终端窗口一直开着，然后在发现变化的时候，打出一串长长长的字符串。。。真是一个挫办法。。

不管怎么说，这个方式大约是实现了。

然后试试 php，php 不愧是为网页量身的脚本语言，抓取页面，解析页面，都是很方便的，来看这段代码

// Create a stream
$opts = array(
  'http'=>array(
    'method'=>"GET",
    'header'=>"Cookie:...\r\n"
  )
);

$context = stream_context_create($opts);

// Open the file using the HTTP headers set above
$file = file_get_contents('http://...', false, $context);

可以看到 php 抓取页面并不比 python 引以为豪的 urllib2 复杂，然后再来看解析页面

$table = strstr($file, "<tbody>");
$table = substr($table, 0, strpos($table, "</tbody>"));
$tr_arr = explode("<tr>", $table);

foreach($tr_arr as &$tr) {
    $tr = trim(strip_tags($tr));
    //var_dump($tr);
}

//var_dump($tr_arr);

if (strstr($tr_arr[1], "...") == false) {
    echo 1;
} else {
    echo 0;
}

在 strip_tags 这个神奇函数的帮助下，我们可以十分轻松的把页面的内容抽取出来，然后稍微字符串查找一下，就 ok 了。

但是这个依然遇到的问题就是怎么提示，由于 python 是常驻脚本，还可以死循环跑，然后终端打出，但是 php 被设计为一个短暂脚本，那么，看来就要上 js 了。

说道这里，就想起来之前 gmail 上面出现过的桌面通知，这可是个好东西，搜了一下，找到这个文章，http://www.cnblogs.com/cloudlee/archive/2012/09/19/2694074.html，按照里面的方法，敲进去，但是发现弹不出来啊，再一阵搜，找到这里，http://stackoverflow.com/questions/5040107/webkit-notifications-requestpermission-function-doesnt-work，人说了，要在回调里面调这个函数，那么可以得到代码如下

<script src="http://codeorigin.jquery.com/jquery-1.10.2.min.js"></script>

<button id="btn">request notify permission</button>

<script>
    function notify() {
        if (window.webkitNotifications.checkPermission() == 0) {
            window.webkitNotifications.createNotification('image.png', '标题', '内容').show();
        } else {
            window.webkitNotifications.requestPermission(notify);
        }
    }
    $(function(){
        $("#btn").click(function(){
            notify();
        });
        setInterval(function(){            
            $.get("mo.php", function(data){
            if (data != 0) {
                notify();
            } else {
                console.log(new Date());
            }
       });
       }, 10000);    
    });
</script>

至此需求基本完成

历史评论

wanax (2013-12-03 09:16:24):

这个可以有啊登录的录写错了<–_<–

TonySeek (2014-01-03 02:49:51):

Python 分析网页应该用 requests + lxml，前者下载内容，后者有 HTML Parser 并且支持 XPath 语法。

标准库的 urllib 系的 API 设计实在反人类，Beautiful Soup 的 CSS 选择器其实远不如 XPath 灵活和易于修改。

ZRJ (2014-01-03 20:48:01):

一个人两个电脑，一个用来查资料上网逛 bbs，另外一个用来写代码的机器是不能连外网的，于是 py 的那些什么在线自动安装的包管理就悲剧了，下载了安装包拖到另外一台机器发现装起来麻烦，还跑不起来，时间又赶，自然就换上 php 自带的内置函数了。。

TonySeek (2014-01-03 21:14:42):

Python 也可以像 Java 的 jar 包一样，把库下载下来用的～

真用 PHP 也应该有 xml 解析库吧？手动拆字符串，万一别人网页变了，改代码多痛苦～

ZRJ (2014-01-04 09:35:43):

原来有类 jar 的包。。我看看。。我上次装的 py 库是 msi 的封装形式。。当时还想着怎么这么奇葩。。

Javascript 执行一次 MD5 或 SHA1 需要多久

Wed, 03 Apr 2013 15:16:44 +0800

首先是 Javascript 算 MD5 的问题，看到这里，http://pajhome.org.uk/crypt/md5/，于是就是加一个时间打点，然后跑了

<script>

/*
 * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message
 * Digest Algorithm, as defined in RFC 1321.
 * Version 2.2 Copyright (C) Paul Johnston 1999 - 2009
 * Other contributors: Greg Holt, Andrew Kepert, Ydnar, Lostinet
 * Distributed under the BSD License
 * See http://pajhome.org.uk/crypt/md5 for more info.
 */

/*
 * Configurable variables. You may need to tweak these to be compatible with
 * the server-side, but the defaults work in most cases.
 */
var hexcase = 0;   /* hex output format. 0 - lowercase; 1 - uppercase        */
var b64pad  = "";  /* base-64 pad character. "=" for strict RFC compliance   */

/*
 * These are the functions you'll usually want to call
 * They take string arguments and return either hex or base-64 encoded strings
 */
function hex_md5(s)    { return rstr2hex(rstr_md5(str2rstr_utf8(s))); }
function b64_md5(s)    { return rstr2b64(rstr_md5(str2rstr_utf8(s))); }
function any_md5(s, e) { return rstr2any(rstr_md5(str2rstr_utf8(s)), e); }
function hex_hmac_md5(k, d)
  { return rstr2hex(rstr_hmac_md5(str2rstr_utf8(k), str2rstr_utf8(d))); }
function b64_hmac_md5(k, d)
  { return rstr2b64(rstr_hmac_md5(str2rstr_utf8(k), str2rstr_utf8(d))); }
function any_hmac_md5(k, d, e)
  { return rstr2any(rstr_hmac_md5(str2rstr_utf8(k), str2rstr_utf8(d)), e); }

/*
 * Perform a simple self-test to see if the VM is working
 */
function md5_vm_test()
{
  return hex_md5("abc").toLowerCase() == "900150983cd24fb0d6963f7d28e17f72";
}

/*
 * Calculate the MD5 of a raw string
 */
function rstr_md5(s)
{
  return binl2rstr(binl_md5(rstr2binl(s), s.length * 8));
}

/*
 * Calculate the HMAC-MD5, of a key and some data (raw strings)
 */
function rstr_hmac_md5(key, data)
{
  var bkey = rstr2binl(key);
  if(bkey.length > 16) bkey = binl_md5(bkey, key.length * 8);

  var ipad = Array(16), opad = Array(16);
  for(var i = 0; i < 16; i++)
  {
    ipad[i] = bkey[i] ^ 0x36363636;
    opad[i] = bkey[i] ^ 0x5C5C5C5C;
  }

  var hash = binl_md5(ipad.concat(rstr2binl(data)), 512 + data.length * 8);
  return binl2rstr(binl_md5(opad.concat(hash), 512 + 128));
}

/*
 * Convert a raw string to a hex string
 */
function rstr2hex(input)
{
  try { hexcase } catch(e) { hexcase=0; }
  var hex_tab = hexcase ? "0123456789ABCDEF" : "0123456789abcdef";
  var output = "";
  var x;
  for(var i = 0; i < input.length; i++)
  {
    x = input.charCodeAt(i);
    output += hex_tab.charAt((x >>> 4) & 0x0F)
           +  hex_tab.charAt( x        & 0x0F);
  }
  return output;
}

/*
 * Convert a raw string to a base-64 string
 */
function rstr2b64(input)
{
  try { b64pad } catch(e) { b64pad=''; }
  var tab = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
  var output = "";
  var len = input.length;
  for(var i = 0; i < len; i += 3)
  {
    var triplet = (input.charCodeAt(i) << 16)
                | (i + 1 < len ? input.charCodeAt(i+1) << 8 : 0)
                | (i + 2 < len ? input.charCodeAt(i+2)      : 0);
    for(var j = 0; j < 4; j++)
    {
      if(i * 8 + j * 6 > input.length * 8) output += b64pad;
      else output += tab.charAt((triplet >>> 6*(3-j)) & 0x3F);
    }
  }
  return output;
}

/*
 * Convert a raw string to an arbitrary string encoding
 */
function rstr2any(input, encoding)
{
  var divisor = encoding.length;
  var i, j, q, x, quotient;

  /* Convert to an array of 16-bit big-endian values, forming the dividend */
  var dividend = Array(Math.ceil(input.length / 2));
  for(i = 0; i < dividend.length; i++)
  {
    dividend[i] = (input.charCodeAt(i * 2) << 8) | input.charCodeAt(i * 2 + 1);
  }

  /*
   * Repeatedly perform a long division. The binary array forms the dividend,
   * the length of the encoding is the divisor. Once computed, the quotient
   * forms the dividend for the next step. All remainders are stored for later
   * use.
   */
  var full_length = Math.ceil(input.length * 8 /
                                    (Math.log(encoding.length) / Math.log(2)));
  var remainders = Array(full_length);
  for(j = 0; j < full_length; j++)
  {
    quotient = Array();
    x = 0;
    for(i = 0; i < dividend.length; i++)
    {
      x = (x << 16) + dividend[i];
      q = Math.floor(x / divisor);
      x -= q * divisor;
      if(quotient.length > 0 || q > 0)
        quotient[quotient.length] = q;
    }
    remainders[j] = x;
    dividend = quotient;
  }

  /* Convert the remainders to the output string */
  var output = "";
  for(i = remainders.length - 1; i >= 0; i--)
    output += encoding.charAt(remainders[i]);

  return output;
}

/*
 * Encode a string as utf-8.
 * For efficiency, this assumes the input is valid utf-16.
 */
function str2rstr_utf8(input)
{
  var output = "";
  var i = -1;
  var x, y;

  while(++i < input.length)
  {
    /* Decode utf-16 surrogate pairs */
    x = input.charCodeAt(i);
    y = i + 1 < input.length ? input.charCodeAt(i + 1) : 0;
    if(0xD800 <= x && x <= 0xDBFF && 0xDC00 <= y && y <= 0xDFFF)
    {
      x = 0x10000 + ((x & 0x03FF) << 10) + (y & 0x03FF);
      i++;
    }

    /* Encode output as utf-8 */
    if(x <= 0x7F)
      output += String.fromCharCode(x);
    else if(x <= 0x7FF)
      output += String.fromCharCode(0xC0 | ((x >>> 6 ) & 0x1F),
                                    0x80 | ( x         & 0x3F));
    else if(x <= 0xFFFF)
      output += String.fromCharCode(0xE0 | ((x >>> 12) & 0x0F),
                                    0x80 | ((x >>> 6 ) & 0x3F),
                                    0x80 | ( x         & 0x3F));
    else if(x <= 0x1FFFFF)
      output += String.fromCharCode(0xF0 | ((x >>> 18) & 0x07),
                                    0x80 | ((x >>> 12) & 0x3F),
                                    0x80 | ((x >>> 6 ) & 0x3F),
                                    0x80 | ( x         & 0x3F));
  }
  return output;
}

/*
 * Encode a string as utf-16
 */
function str2rstr_utf16le(input)
{
  var output = "";
  for(var i = 0; i < input.length; i++)
    output += String.fromCharCode( input.charCodeAt(i)        & 0xFF,
                                  (input.charCodeAt(i) >>> 8) & 0xFF);
  return output;
}

function str2rstr_utf16be(input)
{
  var output = "";
  for(var i = 0; i < input.length; i++)
    output += String.fromCharCode((input.charCodeAt(i) >>> 8) & 0xFF,
                                   input.charCodeAt(i)        & 0xFF);
  return output;
}

/*
 * Convert a raw string to an array of little-endian words
 * Characters >255 have their high-byte silently ignored.
 */
function rstr2binl(input)
{
  var output = Array(input.length >> 2);
  for(var i = 0; i < output.length; i++)
    output[i] = 0;
  for(var i = 0; i < input.length * 8; i += 8)
    output[i>>5] |= (input.charCodeAt(i / 8) & 0xFF) << (i%32);
  return output;
}

/*
 * Convert an array of little-endian words to a string
 */
function binl2rstr(input)
{
  var output = "";
  for(var i = 0; i < input.length * 32; i += 8)
    output += String.fromCharCode((input[i>>5] >>> (i % 32)) & 0xFF);
  return output;
}

/*
 * Calculate the MD5 of an array of little-endian words, and a bit length.
 */
function binl_md5(x, len)
{
  /* append padding */
  x[len >> 5] |= 0x80 << ((len) % 32);
  x[(((len + 64) >>> 9) << 4) + 14] = len;

  var a =  1732584193;
  var b = -271733879;
  var c = -1732584194;
  var d =  271733878;

  for(var i = 0; i < x.length; i += 16)
  {
    var olda = a;
    var oldb = b;
    var oldc = c;
    var oldd = d;

    a = md5_ff(a, b, c, d, x[i+ 0], 7 , -680876936);
    d = md5_ff(d, a, b, c, x[i+ 1], 12, -389564586);
    c = md5_ff(c, d, a, b, x[i+ 2], 17,  606105819);
    b = md5_ff(b, c, d, a, x[i+ 3], 22, -1044525330);
    a = md5_ff(a, b, c, d, x[i+ 4], 7 , -176418897);
    d = md5_ff(d, a, b, c, x[i+ 5], 12,  1200080426);
    c = md5_ff(c, d, a, b, x[i+ 6], 17, -1473231341);
    b = md5_ff(b, c, d, a, x[i+ 7], 22, -45705983);
    a = md5_ff(a, b, c, d, x[i+ 8], 7 ,  1770035416);
    d = md5_ff(d, a, b, c, x[i+ 9], 12, -1958414417);
    c = md5_ff(c, d, a, b, x[i+10], 17, -42063);
    b = md5_ff(b, c, d, a, x[i+11], 22, -1990404162);
    a = md5_ff(a, b, c, d, x[i+12], 7 ,  1804603682);
    d = md5_ff(d, a, b, c, x[i+13], 12, -40341101);
    c = md5_ff(c, d, a, b, x[i+14], 17, -1502002290);
    b = md5_ff(b, c, d, a, x[i+15], 22,  1236535329);

    a = md5_gg(a, b, c, d, x[i+ 1], 5 , -165796510);
    d = md5_gg(d, a, b, c, x[i+ 6], 9 , -1069501632);
    c = md5_gg(c, d, a, b, x[i+11], 14,  643717713);
    b = md5_gg(b, c, d, a, x[i+ 0], 20, -373897302);
    a = md5_gg(a, b, c, d, x[i+ 5], 5 , -701558691);
    d = md5_gg(d, a, b, c, x[i+10], 9 ,  38016083);
    c = md5_gg(c, d, a, b, x[i+15], 14, -660478335);
    b = md5_gg(b, c, d, a, x[i+ 4], 20, -405537848);
    a = md5_gg(a, b, c, d, x[i+ 9], 5 ,  568446438);
    d = md5_gg(d, a, b, c, x[i+14], 9 , -1019803690);
    c = md5_gg(c, d, a, b, x[i+ 3], 14, -187363961);
    b = md5_gg(b, c, d, a, x[i+ 8], 20,  1163531501);
    a = md5_gg(a, b, c, d, x[i+13], 5 , -1444681467);
    d = md5_gg(d, a, b, c, x[i+ 2], 9 , -51403784);
    c = md5_gg(c, d, a, b, x[i+ 7], 14,  1735328473);
    b = md5_gg(b, c, d, a, x[i+12], 20, -1926607734);

    a = md5_hh(a, b, c, d, x[i+ 5], 4 , -378558);
    d = md5_hh(d, a, b, c, x[i+ 8], 11, -2022574463);
    c = md5_hh(c, d, a, b, x[i+11], 16,  1839030562);
    b = md5_hh(b, c, d, a, x[i+14], 23, -35309556);
    a = md5_hh(a, b, c, d, x[i+ 1], 4 , -1530992060);
    d = md5_hh(d, a, b, c, x[i+ 4], 11,  1272893353);
    c = md5_hh(c, d, a, b, x[i+ 7], 16, -155497632);
    b = md5_hh(b, c, d, a, x[i+10], 23, -1094730640);
    a = md5_hh(a, b, c, d, x[i+13], 4 ,  681279174);
    d = md5_hh(d, a, b, c, x[i+ 0], 11, -358537222);
    c = md5_hh(c, d, a, b, x[i+ 3], 16, -722521979);
    b = md5_hh(b, c, d, a, x[i+ 6], 23,  76029189);
    a = md5_hh(a, b, c, d, x[i+ 9], 4 , -640364487);
    d = md5_hh(d, a, b, c, x[i+12], 11, -421815835);
    c = md5_hh(c, d, a, b, x[i+15], 16,  530742520);
    b = md5_hh(b, c, d, a, x[i+ 2], 23, -995338651);

    a = md5_ii(a, b, c, d, x[i+ 0], 6 , -198630844);
    d = md5_ii(d, a, b, c, x[i+ 7], 10,  1126891415);
    c = md5_ii(c, d, a, b, x[i+14], 15, -1416354905);
    b = md5_ii(b, c, d, a, x[i+ 5], 21, -57434055);
    a = md5_ii(a, b, c, d, x[i+12], 6 ,  1700485571);
    d = md5_ii(d, a, b, c, x[i+ 3], 10, -1894986606);
    c = md5_ii(c, d, a, b, x[i+10], 15, -1051523);
    b = md5_ii(b, c, d, a, x[i+ 1], 21, -2054922799);
    a = md5_ii(a, b, c, d, x[i+ 8], 6 ,  1873313359);
    d = md5_ii(d, a, b, c, x[i+15], 10, -30611744);
    c = md5_ii(c, d, a, b, x[i+ 6], 15, -1560198380);
    b = md5_ii(b, c, d, a, x[i+13], 21,  1309151649);
    a = md5_ii(a, b, c, d, x[i+ 4], 6 , -145523070);
    d = md5_ii(d, a, b, c, x[i+11], 10, -1120210379);
    c = md5_ii(c, d, a, b, x[i+ 2], 15,  718787259);
    b = md5_ii(b, c, d, a, x[i+ 9], 21, -343485551);

    a = safe_add(a, olda);
    b = safe_add(b, oldb);
    c = safe_add(c, oldc);
    d = safe_add(d, oldd);
  }
  return Array(a, b, c, d);
}

/*
 * These functions implement the four basic operations the algorithm uses.
 */
function md5_cmn(q, a, b, x, s, t)
{
  return safe_add(bit_rol(safe_add(safe_add(a, q), safe_add(x, t)), s),b);
}
function md5_ff(a, b, c, d, x, s, t)
{
  return md5_cmn((b & c) | ((~b) & d), a, b, x, s, t);
}
function md5_gg(a, b, c, d, x, s, t)
{
  return md5_cmn((b & d) | (c & (~d)), a, b, x, s, t);
}
function md5_hh(a, b, c, d, x, s, t)
{
  return md5_cmn(b ^ c ^ d, a, b, x, s, t);
}
function md5_ii(a, b, c, d, x, s, t)
{
  return md5_cmn(c ^ (b | (~d)), a, b, x, s, t);
}

/*
 * Add integers, wrapping at 2^32. This uses 16-bit operations internally
 * to work around bugs in some JS interpreters.
 */
function safe_add(x, y)
{
  var lsw = (x & 0xFFFF) + (y & 0xFFFF);
  var msw = (x >> 16) + (y >> 16) + (lsw >> 16);
  return (msw << 16) | (lsw & 0xFFFF);
}

/*
 * Bitwise rotate a 32-bit number to the left.
 */
function bit_rol(num, cnt)
{
  return (num << cnt) | (num >>> (32 - cnt));
}

</script>

<script>
var begin = new Date();
var rand = String(Math.random());
for (var i = 0; i < 1000000; i++) {    
    hex_md5(rand);
}
var end = new Date();
document.write(end.getTime() - begin.getTime());
</script>

结果是 6216 左右，单位是毫秒，这里跑了 100 万次，那么就是说每次才 6.216 个微秒。

接下来是 SHA1

<script>
/*
 * A JavaScript implementation of the Secure Hash Algorithm, SHA-1, as defined
 * in FIPS 180-1
 * Version 2.2 Copyright Paul Johnston 2000 - 2009.
 * Other contributors: Greg Holt, Andrew Kepert, Ydnar, Lostinet
 * Distributed under the BSD License
 * See http://pajhome.org.uk/crypt/md5 for details.
 */

/*
 * Configurable variables. You may need to tweak these to be compatible with
 * the server-side, but the defaults work in most cases.
 */
var hexcase = 0;  /* hex output format. 0 - lowercase; 1 - uppercase        */
var b64pad  = ""; /* base-64 pad character. "=" for strict RFC compliance   */

/*
 * These are the functions you'll usually want to call
 * They take string arguments and return either hex or base-64 encoded strings
 */
function hex_sha1(s)    { return rstr2hex(rstr_sha1(str2rstr_utf8(s))); }
function b64_sha1(s)    { return rstr2b64(rstr_sha1(str2rstr_utf8(s))); }
function any_sha1(s, e) { return rstr2any(rstr_sha1(str2rstr_utf8(s)), e); }
function hex_hmac_sha1(k, d)
  { return rstr2hex(rstr_hmac_sha1(str2rstr_utf8(k), str2rstr_utf8(d))); }
function b64_hmac_sha1(k, d)
  { return rstr2b64(rstr_hmac_sha1(str2rstr_utf8(k), str2rstr_utf8(d))); }
function any_hmac_sha1(k, d, e)
  { return rstr2any(rstr_hmac_sha1(str2rstr_utf8(k), str2rstr_utf8(d)), e); }

/*
 * Perform a simple self-test to see if the VM is working
 */
function sha1_vm_test()
{
  return hex_sha1("abc").toLowerCase() == "a9993e364706816aba3e25717850c26c9cd0d89d";
}

/*
 * Calculate the SHA1 of a raw string
 */
function rstr_sha1(s)
{
  return binb2rstr(binb_sha1(rstr2binb(s), s.length * 8));
}

/*
 * Calculate the HMAC-SHA1 of a key and some data (raw strings)
 */
function rstr_hmac_sha1(key, data)
{
  var bkey = rstr2binb(key);
  if(bkey.length > 16) bkey = binb_sha1(bkey, key.length * 8);

  var ipad = Array(16), opad = Array(16);
  for(var i = 0; i < 16; i++)
  {
    ipad[i] = bkey[i] ^ 0x36363636;
    opad[i] = bkey[i] ^ 0x5C5C5C5C;
  }

  var hash = binb_sha1(ipad.concat(rstr2binb(data)), 512 + data.length * 8);
  return binb2rstr(binb_sha1(opad.concat(hash), 512 + 160));
}

/*
 * Convert a raw string to a hex string
 */
function rstr2hex(input)
{
  try { hexcase } catch(e) { hexcase=0; }
  var hex_tab = hexcase ? "0123456789ABCDEF" : "0123456789abcdef";
  var output = "";
  var x;
  for(var i = 0; i < input.length; i++)
  {
    x = input.charCodeAt(i);
    output += hex_tab.charAt((x >>> 4) & 0x0F)
           +  hex_tab.charAt( x        & 0x0F);
  }
  return output;
}

/*
 * Convert a raw string to a base-64 string
 */
function rstr2b64(input)
{
  try { b64pad } catch(e) { b64pad=''; }
  var tab = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
  var output = "";
  var len = input.length;
  for(var i = 0; i < len; i += 3)
  {
    var triplet = (input.charCodeAt(i) << 16)
                | (i + 1 < len ? input.charCodeAt(i+1) << 8 : 0)
                | (i + 2 < len ? input.charCodeAt(i+2)      : 0);
    for(var j = 0; j < 4; j++)
    {
      if(i * 8 + j * 6 > input.length * 8) output += b64pad;
      else output += tab.charAt((triplet >>> 6*(3-j)) & 0x3F);
    }
  }
  return output;
}

/*
 * Convert a raw string to an arbitrary string encoding
 */
function rstr2any(input, encoding)
{
  var divisor = encoding.length;
  var remainders = Array();
  var i, q, x, quotient;

  /* Convert to an array of 16-bit big-endian values, forming the dividend */
  var dividend = Array(Math.ceil(input.length / 2));
  for(i = 0; i < dividend.length; i++)
  {
    dividend[i] = (input.charCodeAt(i * 2) << 8) | input.charCodeAt(i * 2 + 1);
  }

  /*
   * Repeatedly perform a long division. The binary array forms the dividend,
   * the length of the encoding is the divisor. Once computed, the quotient
   * forms the dividend for the next step. We stop when the dividend is zero.
   * All remainders are stored for later use.
   */
  while(dividend.length > 0)
  {
    quotient = Array();
    x = 0;
    for(i = 0; i < dividend.length; i++)
    {
      x = (x << 16) + dividend[i];
      q = Math.floor(x / divisor);
      x -= q * divisor;
      if(quotient.length > 0 || q > 0)
        quotient[quotient.length] = q;
    }
    remainders[remainders.length] = x;
    dividend = quotient;
  }

  /* Convert the remainders to the output string */
  var output = "";
  for(i = remainders.length - 1; i >= 0; i--)
    output += encoding.charAt(remainders[i]);

  /* Append leading zero equivalents */
  var full_length = Math.ceil(input.length * 8 /
                                    (Math.log(encoding.length) / Math.log(2)))
  for(i = output.length; i < full_length; i++)
    output = encoding[0] + output;

  return output;
}

/*
 * Encode a string as utf-8.
 * For efficiency, this assumes the input is valid utf-16.
 */
function str2rstr_utf8(input)
{
  var output = "";
  var i = -1;
  var x, y;

  while(++i < input.length)
  {
    /* Decode utf-16 surrogate pairs */
    x = input.charCodeAt(i);
    y = i + 1 < input.length ? input.charCodeAt(i + 1) : 0;
    if(0xD800 <= x && x <= 0xDBFF && 0xDC00 <= y && y <= 0xDFFF)
    {
      x = 0x10000 + ((x & 0x03FF) << 10) + (y & 0x03FF);
      i++;
    }

    /* Encode output as utf-8 */
    if(x <= 0x7F)
      output += String.fromCharCode(x);
    else if(x <= 0x7FF)
      output += String.fromCharCode(0xC0 | ((x >>> 6 ) & 0x1F),
                                    0x80 | ( x         & 0x3F));
    else if(x <= 0xFFFF)
      output += String.fromCharCode(0xE0 | ((x >>> 12) & 0x0F),
                                    0x80 | ((x >>> 6 ) & 0x3F),
                                    0x80 | ( x         & 0x3F));
    else if(x <= 0x1FFFFF)
      output += String.fromCharCode(0xF0 | ((x >>> 18) & 0x07),
                                    0x80 | ((x >>> 12) & 0x3F),
                                    0x80 | ((x >>> 6 ) & 0x3F),
                                    0x80 | ( x         & 0x3F));
  }
  return output;
}

/*
 * Encode a string as utf-16
 */
function str2rstr_utf16le(input)
{
  var output = "";
  for(var i = 0; i < input.length; i++)
    output += String.fromCharCode( input.charCodeAt(i)        & 0xFF,
                                  (input.charCodeAt(i) >>> 8) & 0xFF);
  return output;
}

function str2rstr_utf16be(input)
{
  var output = "";
  for(var i = 0; i < input.length; i++)
    output += String.fromCharCode((input.charCodeAt(i) >>> 8) & 0xFF,
                                   input.charCodeAt(i)        & 0xFF);
  return output;
}

/*
 * Convert a raw string to an array of big-endian words
 * Characters >255 have their high-byte silently ignored.
 */
function rstr2binb(input)
{
  var output = Array(input.length >> 2);
  for(var i = 0; i < output.length; i++)
    output[i] = 0;
  for(var i = 0; i < input.length * 8; i += 8)
    output[i>>5] |= (input.charCodeAt(i / 8) & 0xFF) << (24 - i % 32);
  return output;
}

/*
 * Convert an array of big-endian words to a string
 */
function binb2rstr(input)
{
  var output = "";
  for(var i = 0; i < input.length * 32; i += 8)
    output += String.fromCharCode((input[i>>5] >>> (24 - i % 32)) & 0xFF);
  return output;
}

/*
 * Calculate the SHA-1 of an array of big-endian words, and a bit length
 */
function binb_sha1(x, len)
{
  /* append padding */
  x[len >> 5] |= 0x80 << (24 - len % 32);
  x[((len + 64 >> 9) << 4) + 15] = len;

  var w = Array(80);
  var a =  1732584193;
  var b = -271733879;
  var c = -1732584194;
  var d =  271733878;
  var e = -1009589776;

  for(var i = 0; i < x.length; i += 16)
  {
    var olda = a;
    var oldb = b;
    var oldc = c;
    var oldd = d;
    var olde = e;

    for(var j = 0; j < 80; j++)
    {
      if(j < 16) w[j] = x[i + j];
      else w[j] = bit_rol(w[j-3] ^ w[j-8] ^ w[j-14] ^ w[j-16], 1);
      var t = safe_add(safe_add(bit_rol(a, 5), sha1_ft(j, b, c, d)),
                       safe_add(safe_add(e, w[j]), sha1_kt(j)));
      e = d;
      d = c;
      c = bit_rol(b, 30);
      b = a;
      a = t;
    }

    a = safe_add(a, olda);
    b = safe_add(b, oldb);
    c = safe_add(c, oldc);
    d = safe_add(d, oldd);
    e = safe_add(e, olde);
  }
  return Array(a, b, c, d, e);

}

/*
 * Perform the appropriate triplet combination function for the current
 * iteration
 */
function sha1_ft(t, b, c, d)
{
  if(t < 20) return (b & c) | ((~b) & d);
  if(t < 40) return b ^ c ^ d;
  if(t < 60) return (b & c) | (b & d) | (c & d);
  return b ^ c ^ d;
}

/*
 * Determine the appropriate additive constant for the current iteration
 */
function sha1_kt(t)
{
  return (t < 20) ?  1518500249 : (t < 40) ?  1859775393 :
         (t < 60) ? -1894007588 : -899497514;
}

/*
 * Add integers, wrapping at 2^32. This uses 16-bit operations internally
 * to work around bugs in some JS interpreters.
 */
function safe_add(x, y)
{
  var lsw = (x & 0xFFFF) + (y & 0xFFFF);
  var msw = (x >> 16) + (y >> 16) + (lsw >> 16);
  return (msw << 16) | (lsw & 0xFFFF);
}

/*
 * Bitwise rotate a 32-bit number to the left.
 */
function bit_rol(num, cnt)
{
  return (num << cnt) | (num >>> (32 - cnt));
}

</script>

<script>
var begin = new Date();
var rand = String(Math.random());
for (var i = 0; i < 1000000; i++) {    
    hex_sha1(rand);
}
var end = new Date();
document.write(end.getTime() - begin.getTime());
</script>

结果是 8184，比 MD5 慢一点点，每个是 8.184 个微秒

附上我的机器配置：

OS 名称 Microsoft Windows 7 专业版版本 6.1.7601 Service Pack 1 内部版本 7601 系统类型 X86-based PC 处理器 Intel(R) Core(TM) i5-3470 CPU @ 3.20GHz，3201 Mhz，4 个内核，4 个逻辑处理器总的物理内存 3.34 GB

来自系统信息工具

浏览器是 chrome 26.0.1410.43 m，对应的 Javascript 引擎是 V8 3.16.14.9

-———————————————————————————–

2013-04-03 15:24:57 update IE 9 下的时间分别是 MD5 15658 ，SHA1 26091

placeholder 的 IE 下兼容实现

Mon, 03 Dec 2012 12:22:29 +0800

鉴于 placeholder 是个 html5 的属性，而恶心的 IE 一如既往的让人失望，于是自己动手丰衣足食，写了个 IE 下的 placeholder 模拟实现，效果如图

IE 8 下测试通过，IE 6 下惨不忍睹，由于这个只是个 weekend project，所以，IE 6 果断放弃，下面是代码

$(function(){
	// placeholder
	if ($.browser.msie) {
		$(':text,:password').each(function(){
			var label = $('<label>');
			label.css({
				'position' : 'absolute',
				'margin-left' : '5px',
				'margin-top' : '5px',
				'color' : 'gray'
			}).text($(this).attr('placeholder'));
			$(this).before(label).focus(function(){
				label.hide();
			}).blur(function(){
				if ($(this).val() == '') {
					label.show();
				}
			});
		});
	}
}

这个实现是有一个问题，在点击 input 框的时候，如果点击到 label 上，是会没有反应的，只能点击 input 框的空白处

===============================================

2012-12-03 15:30:30 改动一点，解决上面的问题

$(function(){
	// placeholder
	if ($.browser.msie) {
		$(':text,:password').each(function(){
			var label = $('<label>');
			label.css({
				'position' : 'absolute',
				'margin-left' : '5px',
				'margin-top' : '5px',
				'color' : 'gray',
				'z-index' : 1
			}).text($(this).attr('placeholder')).click(function(){
				label.hide().next(':input').focus();
			});
			$(this).before(label).focus(function(){
				label.hide();
			}).blur(function(){
				if ($(this).val() == '') {
					label.show();
				}
			});
		});
	}
});

iframe 中元素的居中问题

Fri, 10 Aug 2012 00:07:19 +0800

今晚在折腾 iframe 中元素的居中问题，问题是这样的：在腾讯开放平台上的应用，嵌入平台是使用 iframe 的方式，当一个应用的高度比较长的时候，需要滚动屏幕，那么有两种选择，一种是父级窗口不产生滚动条，在子框架上产生滚动条，另外一种，就是及时的加长 iframe 框架的高度，让框架能够容纳里面的全部内容，从而子框架上可以不出现滚动条，那么就是父级窗口出现滚动条。

问题出在使用的一个叫 fancybox 的 jquery 插件上，这个插件的作用是生成一个浮层，可以用来显示一些图片组啊，或者地图，或者外部视频等等之类的内容，应该说，这个插件还是不错的，只可惜我们应用的场景比较奇葩。他生成的浮层窗口，是相对于当前页面的可视窗口部分居中的，这个特性在一般的情况下没有问题，但是，如果页面是被嵌在一个 iframe 中的话，那么，就会造成他计算出错，从而，浮层窗口是生成在框架页面的中间，如果框架页面很长的话，就会造成浮层窗口父级窗口的可视窗口以下，需要滚动父级窗口才能看到。

我本身前端也就是水一水的水平，遇到问题大概想了想，没有什么非常有把握的思路，于是就 google ，看到这里有讨论，https://groups.google.com/forum/?fromgroups#!topic/fancybox/KPq4mAQn2qc%5B1-25%5D，这位仁兄给了一个方法

I have the same problem: a page includes an iframe that is pretty long and scrollable and inside that iframe I open a fancybox (which also includes yet another iframe, but this is irrelevant here). Fancybox calculates the center of the iframe inside which it has to display itself and positions quite low on the screen because the iframe is long. I’d like it to be positioned in the center of the browser viewport instead. What I found to (somewhat) work is to use this callback when defining the attributes of fancybox (using version 1.3.1):

'onComplete': function() {
                            $("#fancybox-wrap").css({
                            'top':'10px',
                            'left':'10px'
                    })}

It works - moves the fancybox where I want it inside the iframe, but one problem is that it first shows it in the original position and then repositions it which is mildly annoying. I haven’t found a good way to show it in the position I want it when it first gets drawn. Replacing ‘onComplete’ with ‘onStart’ doesn’t do anything. I guess one way would be to have somehow make it invisible on onStart and then make it visible on onComplete when it has been repositioned. Any suggestions would be appreciated!

思路倒也算是清晰易懂，可惜随后就被楼下的另一位仁兄踢馆了，囧

Not that obvious. http://fancybox.net/faq No. 3 also says : “……. You can modify FancyBox source to suit your needs” And a fellow fancybox fan did try modifying it to his needs … see below copy of the email (that I haven’t tried it yet but it makes sense to me)

>forget about the iframe: Basically it >would be great if we had another >two public attributes …etc let’s the developer answer what he thinks of your suggestions

***copy of email ************** hi JFK it work, ive tried it using just a simple tweak, using the on load example $(“a.sample”).trigger(“click”);

here what ive done;

in my iframe page i called the parent window with the href e.g. onClick=“callMe(‘www.google.com’)” or if pics “/images/pics.png”

and call this script in my parent page

in my parent html we right a decoy link (this one is from the example on load fancybox) ******

这里牵扯到要修改父级窗口，这个在我们这个案例里自然是行不通的，而且我也没怎么看懂他的思路，不过我确实试了试前面的方法，是真的不行的，浮层窗口在单步调试可以被设置到上面来，但是一往下运行就又被自动居中了。

于是没办法，仔细的看了看插件的官网，http://fancybox.net/api ，api 文档，连后面的 tops 和 tricks 都看完了，还是没有解决问题，在官方的 FAQ 里面说道，

3. Can the script be called from an iframe?

This is not supported as FancyBox is attached to page body. You can modify FancyBox source to suit your needs

于是打算换一个思路，既然父级滚动条变化的时候，我们需要重新定位浮层窗口，那么直接取父级滚动条的属性就行了吧，甚至可以给父级窗口的滚动条上一个 OnScroll 事件，在这里看到类似的思路，http://hi.baidu.com/bing2liuliu/item/5de3b80a914e41ee359902af ，可惜，试了一下，好像是不行的，于是上线问了问金泉，金泉给了官方的 js 的 sdk 的文档，http://wiki.open.qq.com/wiki/API%E5%88%97%E8%A1%A8 ，在其中有一个 api 是 http://wiki.open.qq.com/wiki/fusion2.canvas.getClientRect ，应该就是他了，不过，悲剧的在服务器上写代码，vim 用起啦真是各种痛苦啊，改着改着，代码就在 chrome 下乱了，明明页面上是有东西的，在 script 标签下居然变空白了，

而且单步跟也诡异

首先是在这里

按理说，单步下去，应该到下一个断点啊，但是，。。。。

神奇的地球还没完，继续单步，

让人不得不感叹，绳命，是入刺的井猜

历史评论

ldpcm3 (2013-04-18 18:45:23):

你好，请问这个问题，你后来解决了吗？

ZRJ (2013-04-19 09:22:53):

呃，不好意思，这个过去太久了。印象中后来是绕开了这个问题，找了另外一种实现，不过我现在基本不怎么写前端 JS 了，所以也不清楚这个问题现在有没有解法，不好意思哈