<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>张经纬的博客</title>
	<atom:link href="http://www.zhangjingwei.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.zhangjingwei.com</link>
	<description>中隐留司官</description>
	<lastBuildDate>Wed, 14 Jul 2010 12:48:33 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>jQuery Autocomplete plugin</title>
		<link>http://www.zhangjingwei.com/archives/jquery-autocomplete/</link>
		<comments>http://www.zhangjingwei.com/archives/jquery-autocomplete/#comments</comments>
		<pubDate>Tue, 13 Jul 2010 10:44:58 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1504</guid>
		<description><![CDATA[写的比较满意，拿出来分享，欢迎大家找BUG。 相对于同类插件，他的特色有3点。 1、可缓存查询结果 （二次查询速度快） 2、非keyup监听方式 （解决某些系统/情况下无法触发keyxxx事件的问题） 3、简洁的参数 （好看？） 插件性能尚好，我的E6500、2G内存，30秒内一共发生了4469次调用，耗时94.65毫秒；百度的是2432次调用，80.24毫秒。 接近1倍的调用是jQuery中的问题，但具体原因我还没弄明白，如果那位兄弟知道的还请不吝赐教。 调用方法 jQuery&#40;&#34;#kw&#34;&#41;.suggest&#40;&#123; url:siteConfig.suggestionUrl, params:&#123; kw:function&#40;&#41;&#123;return jQuery&#40;&#34;#kw&#34;&#41;.val&#40;&#41;&#125;, n:10 &#125; &#125;&#41;; 参数url：baseUrl,例如http://www.target.com/search.php 参数params：url的后缀列表，范例中拼合的url为：http://www.target.com/search.php?kw=xxx&#38;n=10&#38;callback=?（默认加入callback） 参数delay：输入间隔时间，主要是为了降低负载，数值越大，负载越低，查询速度越慢。 参数cache：是否实用缓存，默认为true，例如当搜索“test”时，程序会将对应的查询结果缓存，当第二次搜索test时直接从缓存中读取。 参数formId：必须填写，form表单的id 参数callback：是否使用jsonp以便处理跨域问题。 点击下载源码 加入书签:]]></description>
			<content:encoded><![CDATA[<p>写的比较满意，拿出来分享，欢迎大家找BUG。</p>
<p>相对于同类插件，他的特色有3点。<br />
1、可缓存查询结果 （二次查询速度快）<br />
2、非keyup监听方式 （解决某些系统/情况下无法触发keyxxx事件的问题）<br />
3、简洁的参数 （好看？）</p>
<p>插件性能尚好，我的E6500、2G内存，30秒内一共发生了4469次调用，耗时94.65毫秒；百度的是2432次调用，80.24毫秒。</p>
<p>接近1倍的调用是jQuery中的问题，但具体原因我还没弄明白，如果那位兄弟知道的还请不吝赐教。</p>
<p>调用方法</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;">jQuery<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;#kw&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">suggest</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#123;</span>
	url<span style="color: #339933;">:</span>siteConfig.<span style="color: #660066;">suggestionUrl</span><span style="color: #339933;">,</span>
	params<span style="color: #339933;">:</span><span style="color: #009900;">&#123;</span>
		kw<span style="color: #339933;">:</span><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span><span style="color: #000066; font-weight: bold;">return</span> jQuery<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;#kw&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">val</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#125;</span><span style="color: #339933;">,</span>
		n<span style="color: #339933;">:</span><span style="color: #CC0000;">10</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

<p>参数url：baseUrl,例如http://www.target.com/search.php<br />
参数params：url的后缀列表，范例中拼合的url为：http://www.target.com/search.php?kw=xxx&amp;n=10&amp;callback=?（默认加入callback）<br />
参数delay：输入间隔时间，主要是为了降低负载，数值越大，负载越低，查询速度越慢。<br />
参数cache：是否实用缓存，默认为true，例如当搜索“test”时，程序会将对应的查询结果缓存，当第二次搜索test时直接从缓存中读取。<br />
参数formId：必须填写，form表单的id<br />
参数callback：是否使用jsonp以便处理跨域问题。</p>
<p><a href="http://code.google.com/p/j-autocomplete/downloads/list"><br />
点击下载源码</a></p>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=jQuery%20Autocomplete%20plugin%20&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-autocomplete%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-autocomplete%2F&title=jQuery%20Autocomplete%20plugin%20?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-autocomplete%2F&title=jQuery%20Autocomplete%20plugin%20&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-autocomplete%2F&amp;title=jQuery%20Autocomplete%20plugin%20?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=jQuery%20Autocomplete%20plugin%20&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-autocomplete%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/jquery-autocomplete/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>利用控制器载入对应脚本</title>
		<link>http://www.zhangjingwei.com/archives/load-mod/</link>
		<comments>http://www.zhangjingwei.com/archives/load-mod/#comments</comments>
		<pubDate>Fri, 18 Jun 2010 08:50:35 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1487</guid>
		<description><![CDATA[因项目开发需要，须将每一个方法都独立成单独的js文件以便载入、维护，所以，必须需要有一个控制器用于载入这些方法。 我的思路是，在编写独立模块的时候，注意将这些方法集成到$.tools对象中，接下来，在页面中，调用控制器载入模块，并在载入完成后判断$.tools中对象的个数与预定义载入的模块数是否相等，如不等继续等待，如相等执行回调函数。 /* * LOADScript Mod * Params url1,url2,url3,url4,fn */ jQuery.extend&#40;&#123; loadMod: function&#40;&#41;&#123; var argleng = arguments.length, arglast = arguments&#91;argleng-1&#93;, fn = false, queue = &#91;&#93;, checknum = 0, timer = null ; // init if&#40;jQuery.isFunction&#40;arglast&#41;&#41;&#123;argleng = argleng -1;fn=arglast;&#125; for &#40;var i=0;i&#60;argleng ;i++&#41;&#123; queue.push&#40;arguments&#91;i&#93;&#41;; &#125; &#160; // getscript jQuery.each&#40;queue,function&#40;i,o&#41;&#123; jQuery.getScript&#40;o&#41;; &#125;&#41;; &#160; // check load [...]]]></description>
			<content:encoded><![CDATA[<p>因项目开发需要，须将每一个方法都独立成单独的js文件以便载入、维护，所以，必须需要有一个控制器用于载入这些方法。</p>
<p>我的思路是，在编写独立模块的时候，注意将这些方法集成到$.tools对象中，接下来，在页面中，调用控制器载入模块，并在载入完成后判断$.tools中对象的个数与预定义载入的模块数是否相等，如不等继续等待，如相等执行回调函数。</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">/*
* LOADScript Mod
* Params url1,url2,url3,url4,fn
*/</span>
jQuery.<span style="color: #660066;">extend</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#123;</span>
	loadMod<span style="color: #339933;">:</span> <span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
		<span style="color: #003366; font-weight: bold;">var</span> argleng <span style="color: #339933;">=</span> arguments.<span style="color: #660066;">length</span><span style="color: #339933;">,</span>
				arglast <span style="color: #339933;">=</span> arguments<span style="color: #009900;">&#91;</span>argleng<span style="color: #339933;">-</span><span style="color: #CC0000;">1</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span>
				fn <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">false</span><span style="color: #339933;">,</span>
				queue <span style="color: #339933;">=</span> <span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span>
				checknum <span style="color: #339933;">=</span> <span style="color: #CC0000;">0</span><span style="color: #339933;">,</span>
				timer <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">null</span>
		<span style="color: #339933;">;</span>
		<span style="color: #006600; font-style: italic;">// init</span>
		<span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span>jQuery.<span style="color: #660066;">isFunction</span><span style="color: #009900;">&#40;</span>arglast<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>argleng <span style="color: #339933;">=</span> argleng <span style="color: #339933;">-</span><span style="color: #CC0000;">1</span><span style="color: #339933;">;</span>fn<span style="color: #339933;">=</span>arglast<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span>
		<span style="color: #000066; font-weight: bold;">for</span> <span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">var</span> i<span style="color: #339933;">=</span><span style="color: #CC0000;">0</span><span style="color: #339933;">;</span>i<span style="color: #339933;">&lt;</span>argleng <span style="color: #339933;">;</span>i<span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
			queue.<span style="color: #660066;">push</span><span style="color: #009900;">&#40;</span>arguments<span style="color: #009900;">&#91;</span>i<span style="color: #009900;">&#93;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span>
&nbsp;
		<span style="color: #006600; font-style: italic;">// getscript</span>
		jQuery.<span style="color: #660066;">each</span><span style="color: #009900;">&#40;</span>queue<span style="color: #339933;">,</span><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span>i<span style="color: #339933;">,</span>o<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
			jQuery.<span style="color: #660066;">getScript</span><span style="color: #009900;">&#40;</span>o<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
		<span style="color: #006600; font-style: italic;">// check load ready?</span>
		loadReady<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
		<span style="color: #003366; font-weight: bold;">function</span> loadReady<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
			<span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span>jQuery.<span style="color: #660066;">tools</span> <span style="color: #339933;">!=</span> undefined<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
				checknum <span style="color: #339933;">=</span> <span style="color: #CC0000;">0</span><span style="color: #339933;">;</span>
				$.<span style="color: #660066;">each</span><span style="color: #009900;">&#40;</span>jQuery.<span style="color: #660066;">tools</span><span style="color: #339933;">,</span><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span>i<span style="color: #339933;">,</span>n<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
					<span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span>jQuery.<span style="color: #660066;">isPlainObject</span><span style="color: #009900;">&#40;</span>n<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>checknum<span style="color: #339933;">++;</span><span style="color: #009900;">&#125;</span>
				<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			<span style="color: #009900;">&#125;</span>
			<span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span>checknum <span style="color: #339933;">!=</span> argleng<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
					clearTimeout<span style="color: #009900;">&#40;</span>timer<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
					timer <span style="color: #339933;">=</span> setTimeout<span style="color: #009900;">&#40;</span>loadReady<span style="color: #339933;">,</span> <span style="color: #CC0000;">100</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			<span style="color: #009900;">&#125;</span><span style="color: #000066; font-weight: bold;">else</span><span style="color: #009900;">&#123;</span>
					<span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span><span style="color: #339933;">!!</span>fn<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>fn.<span style="color: #660066;">call</span><span style="color: #009900;">&#40;</span>document.<span style="color: #660066;">jQuery</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#125;</span>
			<span style="color: #009900;">&#125;</span>
&nbsp;
		<span style="color: #009900;">&#125;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// 使用方法</span>
$.<span style="color: #660066;">loadMod</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'a.js'</span><span style="color: #339933;">,</span><span style="color: #3366CC;">'b.js'</span><span style="color: #339933;">,</span><span style="color: #3366CC;">'c.js'</span><span style="color: #339933;">,</span><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
  <span style="color: #000066;">alert</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'success!'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

<p></argleng></pre>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=%E5%88%A9%E7%94%A8%E6%8E%A7%E5%88%B6%E5%99%A8%E8%BD%BD%E5%85%A5%E5%AF%B9%E5%BA%94%E8%84%9A%E6%9C%AC&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fload-mod%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fload-mod%2F&title=%E5%88%A9%E7%94%A8%E6%8E%A7%E5%88%B6%E5%99%A8%E8%BD%BD%E5%85%A5%E5%AF%B9%E5%BA%94%E8%84%9A%E6%9C%AC?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fload-mod%2F&title=%E5%88%A9%E7%94%A8%E6%8E%A7%E5%88%B6%E5%99%A8%E8%BD%BD%E5%85%A5%E5%AF%B9%E5%BA%94%E8%84%9A%E6%9C%AC&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fload-mod%2F&amp;title=%E5%88%A9%E7%94%A8%E6%8E%A7%E5%88%B6%E5%99%A8%E8%BD%BD%E5%85%A5%E5%AF%B9%E5%BA%94%E8%84%9A%E6%9C%AC?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=%E5%88%A9%E7%94%A8%E6%8E%A7%E5%88%B6%E5%99%A8%E8%BD%BD%E5%85%A5%E5%AF%B9%E5%BA%94%E8%84%9A%E6%9C%AC&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fload-mod%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/load-mod/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS3 的显示与隐藏</title>
		<link>http://www.zhangjingwei.com/archives/css3-show-and-hide/</link>
		<comments>http://www.zhangjingwei.com/archives/css3-show-and-hide/#comments</comments>
		<pubDate>Tue, 15 Jun 2010 04:38:24 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1480</guid>
		<description><![CDATA[演示地址：http://www.zhangjingwei.com/demo/css-menu.html &#60; !DOCTYPE html&#62; &#60;head&#62; &#60;title&#62;menu mockup&#60;/title&#62; &#60;style type=&#34;text/css&#34;&#62; .show {display: none; } .hide:focus + .show {display: inline; } .hide:focus { display: none; } .hide:focus ~ #list { display:none; } @media print { .hide, .show { display: none; } } &#60;/style&#62; &#60;/head&#62; &#60;body&#62; &#60;p&#62;Here's a list&#60;/p&#62; &#60;div&#62; &#60;a href=&#34;#&#34; class=&#34;hide&#34;&#62;[hide]&#60;/a&#62; &#60;a href=&#34;#&#34; class=&#34;show&#34;&#62;[show]&#60;/a&#62; &#60;ol id=&#34;list&#34;&#62; [...]]]></description>
			<content:encoded><![CDATA[<p>演示地址：<a href="http://www.zhangjingwei.com/demo/css-menu.html">http://www.zhangjingwei.com/demo/css-menu.html</a></p>

<div class="wp_syntax"><div class="code"><pre class="html" style="font-family:monospace;">&lt; !DOCTYPE html&gt;
&lt;head&gt;
   &lt;title&gt;menu mockup&lt;/title&gt;
   &lt;style type=&quot;text/css&quot;&gt;
      .show {display: none; }
      .hide:focus + .show {display: inline; }
      .hide:focus { display: none; }
      .hide:focus ~ #list { display:none; }
      @media print { .hide, .show { display: none; } }
   &lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;
   &lt;p&gt;Here's a list&lt;/p&gt;
      &lt;div&gt;
         &lt;a href=&quot;#&quot; class=&quot;hide&quot;&gt;[hide]&lt;/a&gt;
         &lt;a href=&quot;#&quot; class=&quot;show&quot;&gt;[show]&lt;/a&gt;
         &lt;ol id=&quot;list&quot;&gt;
            &lt;li&gt;item 1&lt;/li&gt;
            &lt;li&gt;item 2&lt;/li&gt;
            &lt;li&gt;item 3&lt;/li&gt;
         &lt;/ol&gt;
      &lt;/div&gt;
   &lt;p&gt;How about that?&lt;/p&gt;
&lt;/body&gt;</pre></div></div>




加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=CSS3%20%E7%9A%84%E6%98%BE%E7%A4%BA%E4%B8%8E%E9%9A%90%E8%97%8F&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcss3-show-and-hide%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcss3-show-and-hide%2F&title=CSS3%20%E7%9A%84%E6%98%BE%E7%A4%BA%E4%B8%8E%E9%9A%90%E8%97%8F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcss3-show-and-hide%2F&title=CSS3%20%E7%9A%84%E6%98%BE%E7%A4%BA%E4%B8%8E%E9%9A%90%E8%97%8F&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcss3-show-and-hide%2F&amp;title=CSS3%20%E7%9A%84%E6%98%BE%E7%A4%BA%E4%B8%8E%E9%9A%90%E8%97%8F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=CSS3%20%E7%9A%84%E6%98%BE%E7%A4%BA%E4%B8%8E%E9%9A%90%E8%97%8F&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcss3-show-and-hide%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/css3-show-and-hide/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>搬到新家了</title>
		<link>http://www.zhangjingwei.com/archives/new-home/</link>
		<comments>http://www.zhangjingwei.com/archives/new-home/#comments</comments>
		<pubDate>Sun, 13 Jun 2010 15:36:16 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[北京2010]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1476</guid>
		<description><![CDATA[在国内3年，空间一直断断续续的，加上我是联通的网络一直用的很不开心，自己想写个博客都要费尽周折。 这几天时间，完全打不开了，一怒之下，就准备换个空间。 寻觅了半天，也不曾找到一个自己心满意足的，正灰心丧气时，得好友叶宁雪中送炭，将VPS送我使用，安放一下自己的小博客。 于是趁着夜黑风高，风雨交加，好友键步如飞，用了20分钟，把我整了3天都没整下来的文件安放、配置完毕；专注成就专业，不佩服不行，再次对叶宁同志的伟大精神表示最崇高的敬意，下次哈根达斯我请！ 搬到新空间，就和搬到新家一样，一切都是新的，以前用的FTP，web控制台，一点也不上等！现在使用的叫做是winSCP的软件管理（好友说叫做ssh，我就听过这个名字 ）只要修改目录名就可以自动解析，域名也是用CNAME解析到一个地址上，这样我就不用随着ip的变更老是去修改解析了。 总之，一切都很上等，哈哈，开心。  加入书签:]]></description>
			<content:encoded><![CDATA[<p>在国内3年，空间一直断断续续的，加上我是联通的网络一直用的很不开心，自己想写个博客都要费尽周折。</p>
<p>这几天时间，完全打不开了，一怒之下，就准备换个空间。</p>
<p>寻觅了半天，也不曾找到一个自己心满意足的，正灰心丧气时，得好友<a href="http://blog.yening.cn">叶宁</a>雪中送炭，将VPS送我使用，安放一下自己的小博客。</p>
<p>于是趁着夜黑风高，风雨交加，好友键步如飞，用了20分钟，把我整了3天都没整下来的文件安放、配置完毕；专注成就专业，不佩服不行，再次对叶宁同志的伟大精神表示最崇高的敬意，下次哈根达斯我请！</p>
<p>搬到新空间，就和搬到新家一样，一切都是新的，以前用的FTP，web控制台，一点也不上等！现在使用的叫做是winSCP的软件管理（好友说叫做ssh，我就听过这个名字 <img src='http://www.zhangjingwei.com/wp-includes/images/smilies/icon_sad.gif' alt=':-(' class='wp-smiley' />  ）只要修改目录名就可以自动解析，域名也是用CNAME解析到一个地址上，这样我就不用随着ip的变更老是去修改解析了。</p>
<p>总之，一切都很上等，哈哈，开心。  <img src='http://www.zhangjingwei.com/wp-includes/images/smilies/icon_smile.gif' alt=':-)' class='wp-smiley' /> </p>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=%E6%90%AC%E5%88%B0%E6%96%B0%E5%AE%B6%E4%BA%86&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fnew-home%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fnew-home%2F&title=%E6%90%AC%E5%88%B0%E6%96%B0%E5%AE%B6%E4%BA%86?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fnew-home%2F&title=%E6%90%AC%E5%88%B0%E6%96%B0%E5%AE%B6%E4%BA%86&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fnew-home%2F&amp;title=%E6%90%AC%E5%88%B0%E6%96%B0%E5%AE%B6%E4%BA%86?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=%E6%90%AC%E5%88%B0%E6%96%B0%E5%AE%B6%E4%BA%86&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fnew-home%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/new-home/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>jQuery Tab plugin</title>
		<link>http://www.zhangjingwei.com/archives/jquery-tab-plugins/</link>
		<comments>http://www.zhangjingwei.com/archives/jquery-tab-plugins/#comments</comments>
		<pubDate>Sun, 13 Jun 2010 15:24:23 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1473</guid>
		<description><![CDATA[因为觉得网上的都太麻烦，于是自己写了一个简单的，只是做tab的切换。 演示地址：http://www.zhangjingwei.com/demo/tab/ 下载地址：源代码 加入书签:]]></description>
			<content:encoded><![CDATA[<p>因为觉得网上的都太麻烦，于是自己写了一个简单的，只是做tab的切换。</p>
<p>演示地址：<a href="http://www.zhangjingwei.com/demo/tab/">http://www.zhangjingwei.com/demo/tab/</a></p>
<p>下载地址：<a href="http://www.zhangjingwei.com/wp-content/uploads/2010/06/tab1.js">源代码</a></p>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=jQuery%20Tab%20plugin&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-tab-plugins%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-tab-plugins%2F&title=jQuery%20Tab%20plugin?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-tab-plugins%2F&title=jQuery%20Tab%20plugin&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-tab-plugins%2F&amp;title=jQuery%20Tab%20plugin?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=jQuery%20Tab%20plugin&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-tab-plugins%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/jquery-tab-plugins/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>十二年，虎年来了</title>
		<link>http://www.zhangjingwei.com/archives/reset/</link>
		<comments>http://www.zhangjingwei.com/archives/reset/#comments</comments>
		<pubDate>Sun, 14 Feb 2010 09:22:00 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[北京2010]]></category>
		<category><![CDATA[2010]]></category>
		<category><![CDATA[虎]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1382</guid>
		<description><![CDATA[十二生肖就像一个钟表的轮盘，在零点的时刻开始，在零点的时刻结束，每一分，每一秒，表盘上都在滴滴答答的演绎着或美好或悲伤，或惊喜或忧愁的故事。 过去的12年，是一个纯情的年代，在表盘归零的时候，恍然发现，这种纯情早以被遗弃，世界在变化，我们每一个人也在变化。 人如宝剑，少年时是随心所欲剑从心生，我们在那个年代挥舞着，挥霍着，虽然毫无章法，但也能不时画出几下凌厉的招式，但终究只是“几下”。 如今，归零时刻，我默默的磨剑，我知道了要想仗剑行天涯，必要十年磨一剑！ 过去的十二年，江湖没有哥的传说；将来的十二年，江湖将会流传哥的传说。 12年，一个归零，12年，一个启始。 十二年，虎年来了。 加入书签:]]></description>
			<content:encoded><![CDATA[<div style="float:left;margin:0 5px 5px 0;"><img class="alignnone size-full wp-image-1389" title="2010年焰花" src="http://www.zhangjingwei.com/wp-content/uploads/2010/02/01.jpg" alt="2010年焰花" width="290" height="236" /></div>
<p>十二生肖就像一个钟表的轮盘，在零点的时刻开始，在零点的时刻结束，每一分，每一秒，表盘上都在滴滴答答的演绎着或美好或悲伤，或惊喜或忧愁的故事。</p>
<p>过去的12年，是一个纯情的年代，在表盘归零的时候，恍然发现，这种纯情早以被遗弃，世界在变化，我们每一个人也在变化。</p>
<p>人如宝剑，少年时是随心所欲剑从心生，我们在那个年代挥舞着，挥霍着，虽然毫无章法，但也能不时画出几下凌厉的招式，但终究只是“几下”。</p>
<p>如今，归零时刻，我默默的磨剑，我知道了要想仗剑行天涯，必要十年磨一剑！</p>
<p>过去的十二年，江湖没有哥的传说；将来的十二年，江湖将会流传哥的传说。</p>
<p>12年，一个归零，12年，一个启始。</p>
<p>十二年，虎年来了。</p>
<div style="clear:both"></div>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=%E5%8D%81%E4%BA%8C%E5%B9%B4%EF%BC%8C%E8%99%8E%E5%B9%B4%E6%9D%A5%E4%BA%86&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Freset%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Freset%2F&title=%E5%8D%81%E4%BA%8C%E5%B9%B4%EF%BC%8C%E8%99%8E%E5%B9%B4%E6%9D%A5%E4%BA%86?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Freset%2F&title=%E5%8D%81%E4%BA%8C%E5%B9%B4%EF%BC%8C%E8%99%8E%E5%B9%B4%E6%9D%A5%E4%BA%86&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Freset%2F&amp;title=%E5%8D%81%E4%BA%8C%E5%B9%B4%EF%BC%8C%E8%99%8E%E5%B9%B4%E6%9D%A5%E4%BA%86?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=%E5%8D%81%E4%BA%8C%E5%B9%B4%EF%BC%8C%E8%99%8E%E5%B9%B4%E6%9D%A5%E4%BA%86&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Freset%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/reset/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Rel与CSS的联合使用</title>
		<link>http://www.zhangjingwei.com/archives/rel-licensecss/</link>
		<comments>http://www.zhangjingwei.com/archives/rel-licensecss/#comments</comments>
		<pubDate>Mon, 08 Feb 2010 09:13:47 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[rel]]></category>
		<category><![CDATA[sns]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1372</guid>
		<description><![CDATA[Rel-License 是微格式的开发标准之一，简单的说就是通过给引用标签（通常是链接）加上REL属性，来标明所引用链接/数据与文章的关系。 WordPress很早就引入了rel标准，在我们添加新链接的时候就可以看到“关系”属性。 早期某些社交类搜索引擎可根据这个标签来判断人与人之间的关系，但它对网页开发来说并无意义，值得庆幸的是随着浏览器的逐渐升级，我们可以利用CSS属性选择器以及REL来做一些有意思的功能。 这是一段带有REL属性的HTML结构。 &#60;ul&#62; &#60;li&#62;&#60;a href=&#34;#&#34; rel=&#34;civil&#34;&#62;小李&#60;/a&#62;&#60;/li&#62; &#60;li&#62;&#60;a href=&#34;#&#34; rel=&#34;party&#34;&#62;局长&#60;/a&#62;&#60;/li&#62; &#60;/ul&#62; 页面中他呈现这个样子 因为局长和小李是两个不同的阶级，所以我们应该有区分他们，我打算在小李和局长后面增加两张图片让他表现出这个样式。 过去，我们需要在两个链接标签上增加不同的class来实现这种样式，并且我们需要针对不同的样式书写不同的CSS .c,.b &#123;background:url&#40;01.png&#41; right center no-repeat;&#125; .b &#123;background-image:url&#40;02.png&#41;;&#125; &#60;ul&#62; &#60;li&#62;&#60;a href=&#34;#&#34; rel=&#34;civil&#34; class=&#34;c&#34;&#62;小李&#60;/a&#62;&#60;/li&#62; &#60;li&#62;&#60;a href=&#34;#&#34; rel=&#34;party&#34; class=&#34;b&#34;&#62;局长&#60;/a&#62;&#60;/li&#62; &#60;/ul&#62; 现在，我们可以利用REL属性以及属性选择器来完成这个工作。 a&#91;rel~=&#34;civil&#34;&#93;&#123;background:url&#40;01.png&#41; right center no-repeat;&#125; a&#91;rel~=&#34;party&#34;&#93;&#123;background:url&#40;02.png&#41; right center no-repeat;&#125; 同时，我们的HTML结构也可以剔除那些多余的样式了。 &#60;ul&#62; &#60;li&#62;&#60;a href=&#34;#&#34; rel=&#34;civil&#34;&#62;小李&#60;/a&#62;&#60;/li&#62; &#60;li&#62;&#60;a href=&#34;#&#34; rel=&#34;party&#34;&#62;局长&#60;/a&#62;&#60;/li&#62; &#60;/ul&#62; 另外:ie6不支持属性选择器，但我们可以用JS来修复这个问题。 加入书签:]]></description>
			<content:encoded><![CDATA[<p><a href="http://microformats.org/wiki/rel-license">Rel-License</a> 是微格式的开发标准之一，简单的说就是通过给引用标签（通常是链接）加上REL属性，来标明所引用链接/数据与文章的关系。</p>
<p>WordPress很早就引入了rel标准，在我们添加新链接的时候就可以看到“关系”属性。</p>
<p>早期某些社交类搜索引擎可根据这个标签来判断人与人之间的关系，但它对网页开发来说并无意义，值得庆幸的是随着浏览器的逐渐升级，我们可以利用CSS属性选择器以及REL来做一些有意思的功能。</p>
<p>这是一段带有REL属性的HTML结构。</p>

<div class="wp_syntax"><div class="code"><pre class="xhtml" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span> <span style="color: #000066;">rel</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;civil&quot;</span>&gt;</span>小李<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span> <span style="color: #000066;">rel</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;party&quot;</span>&gt;</span>局长<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span></pre></div></div>

<p>页面中他呈现这个样子<br />
<a href="http://www.zhangjingwei.com/wp-content/uploads/2010/02/e1.png"><img src="http://www.zhangjingwei.com/wp-content/uploads/2010/02/e1.png" alt="example_01" title="example_01" width="238" height="148" class="alignnone size-full wp-image-1377" /></a></p>
<p>因为局长和小李是两个不同的阶级，所以我们应该有区分他们，我打算在小李和局长后面增加两张图片让他表现出这个样式。<br />
<a href="http://www.zhangjingwei.com/wp-content/uploads/2010/02/e2.png"><img src="http://www.zhangjingwei.com/wp-content/uploads/2010/02/e2.png" alt="e2" title="e2" width="169" height="115" class="alignnone size-full wp-image-1379" /></a></p>
<p>过去，我们需要在两个链接标签上增加不同的class来实现这种样式，并且我们需要针对不同的样式书写不同的CSS</p>

<div class="wp_syntax"><div class="code"><pre class="css" style="font-family:monospace;"> <span style="color: #6666ff;">.c</span><span style="color: #00AA00;">,</span><span style="color: #6666ff;">.b</span> <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span>01.png<span style="color: #00AA00;">&#41;</span> <span style="color: #000000; font-weight: bold;">right</span> <span style="color: #993333;">center</span> <span style="color: #993333;">no-repeat</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span>
 <span style="color: #6666ff;">.b</span> <span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background-image</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span>02.png<span style="color: #00AA00;">&#41;</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span></pre></div></div>


<div class="wp_syntax"><div class="code"><pre class="xhtml" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span> <span style="color: #000066;">rel</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;civil&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;c&quot;</span>&gt;</span>小李<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span> <span style="color: #000066;">rel</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;party&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;b&quot;</span>&gt;</span>局长<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span></pre></div></div>

<p>现在，我们可以利用REL属性以及属性选择器来完成这个工作。</p>

<div class="wp_syntax"><div class="code"><pre class="css" style="font-family:monospace;">a<span style="color: #00AA00;">&#91;</span>rel~<span style="color: #00AA00;">=</span><span style="color: #ff0000;">&quot;civil&quot;</span><span style="color: #00AA00;">&#93;</span><span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span>01.png<span style="color: #00AA00;">&#41;</span> <span style="color: #000000; font-weight: bold;">right</span> <span style="color: #993333;">center</span> <span style="color: #993333;">no-repeat</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span>
a<span style="color: #00AA00;">&#91;</span>rel~<span style="color: #00AA00;">=</span><span style="color: #ff0000;">&quot;party&quot;</span><span style="color: #00AA00;">&#93;</span><span style="color: #00AA00;">&#123;</span><span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span><span style="color: #993333;">url</span><span style="color: #00AA00;">&#40;</span>02.png<span style="color: #00AA00;">&#41;</span> <span style="color: #000000; font-weight: bold;">right</span> <span style="color: #993333;">center</span> <span style="color: #993333;">no-repeat</span><span style="color: #00AA00;">;</span><span style="color: #00AA00;">&#125;</span></pre></div></div>

<p>同时，我们的HTML结构也可以剔除那些多余的样式了。</p>

<div class="wp_syntax"><div class="code"><pre class="xhtml" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">ul</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span> <span style="color: #000066;">rel</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;civil&quot;</span>&gt;</span>小李<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">li</span>&gt;&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span> <span style="color: #000066;">rel</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;party&quot;</span>&gt;</span>局长<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">li</span>&gt;</span>
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">ul</span>&gt;</span></pre></div></div>

<p>另外:ie6不支持属性选择器，但我们可以用JS来修复这个问题。</p>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=Rel%E4%B8%8ECSS%E7%9A%84%E8%81%94%E5%90%88%E4%BD%BF%E7%94%A8&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Frel-licensecss%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Frel-licensecss%2F&title=Rel%E4%B8%8ECSS%E7%9A%84%E8%81%94%E5%90%88%E4%BD%BF%E7%94%A8?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Frel-licensecss%2F&title=Rel%E4%B8%8ECSS%E7%9A%84%E8%81%94%E5%90%88%E4%BD%BF%E7%94%A8&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Frel-licensecss%2F&amp;title=Rel%E4%B8%8ECSS%E7%9A%84%E8%81%94%E5%90%88%E4%BD%BF%E7%94%A8?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=Rel%E4%B8%8ECSS%E7%9A%84%E8%81%94%E5%90%88%E4%BD%BF%E7%94%A8&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Frel-licensecss%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/rel-licensecss/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Luhn 算法的Perl实现</title>
		<link>http://www.zhangjingwei.com/archives/perl-luhn/</link>
		<comments>http://www.zhangjingwei.com/archives/perl-luhn/#comments</comments>
		<pubDate>Tue, 12 Jan 2010 17:09:32 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[Perl]]></category>
		<category><![CDATA[Luhn]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1341</guid>
		<description><![CDATA[Luhn 算法主要应用在校键数字卡号的合法性，例如我们常见的银行卡，信用卡，ICCID号等等。 Luhn 算法简单的说，既从低位开始，基数位相加的和，与处理过的（将当前偶数位数字×2，若结果大于9，则将2位数字相加得到个位数，若结果小于等于9，直接记录这个值）偶数位相加的和的总和，若可被10整除，则合法，反之则不合法。 算法如下： #!/usr/bin/perl use strict; use warnings; &#160; #定义一个卡号 my $cardNum = &#34;4367421590502289184&#34;; &#160; sub luhnCheckNum&#123; my $oddSum = 0; my $evenSum = 0; my $isOdd = 1; for&#40;my $i=length&#40;$_&#91;0&#93;&#41;-1; $i&#62;=0; $i--&#41;&#123; my $iNum = substr&#40;$_&#91;0&#93;,$i,1&#41;; if&#40;$isOdd&#41;&#123; $oddSum += $iNum; &#125;else&#123; $iNum = $iNum*2; if&#40;$iNum&#62;9&#41;&#123; my @iNumArry = split&#40;//, $iNum&#41;; $iNum = [...]]]></description>
			<content:encoded><![CDATA[<p>Luhn 算法主要应用在校键数字卡号的合法性，例如我们常见的银行卡，信用卡，ICCID号等等。</p>
<p>Luhn 算法简单的说，既从低位开始，基数位相加的和，与处理过的（将当前偶数位数字×2，若结果大于9，则将2位数字相加得到个位数，若结果小于等于9，直接记录这个值）偶数位相加的和的总和，若可被10整除，则合法，反之则不合法。</p>
<p>算法如下：</p>

<div class="wp_syntax"><div class="code"><pre class="perl" style="font-family:monospace;"><span style="color: #666666; font-style: italic;">#!/usr/bin/perl</span>
<span style="color: #000000; font-weight: bold;">use</span> strict<span style="color: #339933;">;</span>
<span style="color: #000000; font-weight: bold;">use</span> warnings<span style="color: #339933;">;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">#定义一个卡号</span>
<span style="color: #b1b100;">my</span> <span style="color: #0000ff;">$cardNum</span> <span style="color: #339933;">=</span> <span style="color: #ff0000;">&quot;4367421590502289184&quot;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #000000; font-weight: bold;">sub</span> luhnCheckNum<span style="color: #009900;">&#123;</span>
	<span style="color: #b1b100;">my</span> <span style="color: #0000ff;">$oddSum</span> <span style="color: #339933;">=</span> <span style="color: #cc66cc;">0</span><span style="color: #339933;">;</span>
	<span style="color: #b1b100;">my</span> <span style="color: #0000ff;">$evenSum</span> <span style="color: #339933;">=</span> <span style="color: #cc66cc;">0</span><span style="color: #339933;">;</span>
	<span style="color: #b1b100;">my</span> <span style="color: #0000ff;">$isOdd</span> <span style="color: #339933;">=</span> <span style="color: #cc66cc;">1</span><span style="color: #339933;">;</span>
	<span style="color: #b1b100;">for</span><span style="color: #009900;">&#40;</span><span style="color: #b1b100;">my</span> <span style="color: #0000ff;">$i</span><span style="color: #339933;">=</span><span style="color: #000066;">length</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">$_</span><span style="color: #009900;">&#91;</span><span style="color: #cc66cc;">0</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">-</span><span style="color: #cc66cc;">1</span><span style="color: #339933;">;</span> <span style="color: #0000ff;">$i</span><span style="color: #339933;">&gt;=</span><span style="color: #cc66cc;">0</span><span style="color: #339933;">;</span> <span style="color: #0000ff;">$i</span><span style="color: #339933;">--</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
		<span style="color: #b1b100;">my</span> <span style="color: #0000ff;">$iNum</span> <span style="color: #339933;">=</span> <span style="color: #000066;">substr</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">$_</span><span style="color: #009900;">&#91;</span><span style="color: #cc66cc;">0</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #0000ff;">$i</span><span style="color: #339933;">,</span><span style="color: #cc66cc;">1</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		<span style="color: #b1b100;">if</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">$isOdd</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
			<span style="color: #0000ff;">$oddSum</span> <span style="color: #339933;">+=</span> <span style="color: #0000ff;">$iNum</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span><span style="color: #b1b100;">else</span><span style="color: #009900;">&#123;</span>
			<span style="color: #0000ff;">$iNum</span> <span style="color: #339933;">=</span> <span style="color: #0000ff;">$iNum</span><span style="color: #339933;">*</span><span style="color: #cc66cc;">2</span><span style="color: #339933;">;</span>
			<span style="color: #b1b100;">if</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">$iNum</span><span style="color: #339933;">&gt;</span><span style="color: #cc66cc;">9</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
				<span style="color: #b1b100;">my</span> <span style="color: #0000ff;">@iNumArry</span> <span style="color: #339933;">=</span> <span style="color: #000066;">split</span><span style="color: #009900;">&#40;</span><span style="color: #339933;">//,</span> <span style="color: #0000ff;">$iNum</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
				<span style="color: #0000ff;">$iNum</span> <span style="color: #339933;">=</span> <span style="color: #0000ff;">$iNumArry</span><span style="color: #009900;">&#91;</span><span style="color: #cc66cc;">0</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">+</span><span style="color: #0000ff;">$iNumArry</span><span style="color: #009900;">&#91;</span><span style="color: #cc66cc;">1</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span>
			<span style="color: #009900;">&#125;</span>
			<span style="color: #0000ff;">$evenSum</span> <span style="color: #339933;">+=</span> <span style="color: #0000ff;">$iNum</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span>
		<span style="color: #0000ff;">$isOdd</span> <span style="color: #339933;">=</span> <span style="color: #339933;">!</span><span style="color: #0000ff;">$isOdd</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
	<span style="color: #000066;">return</span> <span style="color: #009900;">&#40;</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">$evenSum</span> <span style="color: #339933;">+</span> <span style="color: #0000ff;">$oddSum</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">%</span>10<span style="color: #339933;">==</span><span style="color: #cc66cc;">0</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #b1b100;">if</span><span style="color: #009900;">&#40;</span>luhnCheckNum<span style="color: #009900;">&#40;</span><span style="color: #0000ff;">$cardNum</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
	<span style="color: #000066;">print</span> <span style="color: #ff0000;">&quot;您输入卡号合法&quot;</span><span style="color: #339933;">;</span>	
<span style="color: #009900;">&#125;</span><span style="color: #b1b100;">else</span><span style="color: #009900;">&#123;</span>
	<span style="color: #000066;">print</span> <span style="color: #ff0000;">&quot;您输入的卡号不合法&quot;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></div></div>




加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=Luhn%20%E7%AE%97%E6%B3%95%E7%9A%84Perl%E5%AE%9E%E7%8E%B0&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-luhn%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-luhn%2F&title=Luhn%20%E7%AE%97%E6%B3%95%E7%9A%84Perl%E5%AE%9E%E7%8E%B0?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-luhn%2F&title=Luhn%20%E7%AE%97%E6%B3%95%E7%9A%84Perl%E5%AE%9E%E7%8E%B0&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-luhn%2F&amp;title=Luhn%20%E7%AE%97%E6%B3%95%E7%9A%84Perl%E5%AE%9E%E7%8E%B0?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=Luhn%20%E7%AE%97%E6%B3%95%E7%9A%84Perl%E5%AE%9E%E7%8E%B0&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-luhn%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/perl-luhn/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Perl 压缩 Js</title>
		<link>http://www.zhangjingwei.com/archives/perl-compression-js/</link>
		<comments>http://www.zhangjingwei.com/archives/perl-compression-js/#comments</comments>
		<pubDate>Tue, 05 Jan 2010 10:54:09 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[Perl]]></category>
		<category><![CDATA[正则]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1335</guid>
		<description><![CDATA[sub compress &#123; my &#40;$codevalue&#41;=@_; $codevalue =~ s/不支持Flash//; $codevalue =~ s/^\s+//; $codevalue =~ s/&#60;!--(.*?)--&#62;//g; $codevalue =~ s/(http&#124;https):\/\//$1:~~/g; $codevalue =~ s/\s*\/\/.*?\n/\n/g; $codevalue =~ s/(http&#124;https):~~/$1:\/\//g; $codevalue =~ s/(^&#124; &#124;\t)\/\/.*$//g; $codevalue =~ s!/\*.*?\*/\s*!!sg; $codevalue =~ s/(;&#124;\n)\t+/$1/g; $codevalue =~ s/\n{2,}/\n/g; $codevalue =~ s/(if&#124;else)\s*(\(.*?\))?\s*([\w\{])/$1$2$3/sg; $codevalue =~ s/[ \t]*([\=\,\+\-\*\&#38;\&#124;\:\?\&#60; \&#62;\{\}\(\)\[\]]+)[ \t]*/$1/g; $codevalue =~ s/^\s*\n//mg; $codevalue =~ s/(;)\s*/$1/g; $codevalue =~ s/(\r\n&#124;\n)//g; $codevalue [...]]]></description>
			<content:encoded><![CDATA[
<div class="wp_syntax"><div class="code"><pre class="perl" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">sub</span> compress <span style="color: #009900;">&#123;</span>
	<span style="color: #b1b100;">my</span> <span style="color: #009900;">&#40;</span><span style="color: #0000ff;">$codevalue</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">=</span><span style="color: #0000ff;">@_</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/不支持Flash//</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/^\s+//</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/&lt;!--(.*?)--&gt;//g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/(http|https):\/\//$1:~~/g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/\s*\/\/.*?\n/\n/g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/(http|https):~~/$1:\/\//g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/(^| |\t)\/\/.*$//g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #000066;">s</span><span style="color: #339933;">!/</span>\<span style="color: #339933;">*.*?</span>\<span style="color: #339933;">*/</span><span style="color: #0000ff;">\s</span><span style="color: #339933;">*!!</span>sg<span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/(;|\n)\t+/$1/g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/\n{2,}/\n/g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/(if|else)\s*(\(.*?\))?\s*([\w\{])/$1$2$3/sg</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/[ \t]*([\=\,\+\-\*\&amp;\|\:\?\&lt; \&gt;\{\}\(\)\[\]]+)[ \t]*/$1/g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/^\s*\n//mg</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/(;)\s*/$1/g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/(\r\n|\n)//g</span><span style="color: #339933;">;</span>
	<span style="color: #0000ff;">$codevalue</span> <span style="color: #339933;">=~</span> <span style="color: #009966; font-style: italic;">s/({)(\s*?)(\S)/$1$3/g</span><span style="color: #339933;">;</span>
	<span style="color: #000066;">return</span> <span style="color: #0000ff;">$codevalue</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></div></div>




加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=Perl%20%E5%8E%8B%E7%BC%A9%20Js&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-compression-js%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-compression-js%2F&title=Perl%20%E5%8E%8B%E7%BC%A9%20Js?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-compression-js%2F&title=Perl%20%E5%8E%8B%E7%BC%A9%20Js&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-compression-js%2F&amp;title=Perl%20%E5%8E%8B%E7%BC%A9%20Js?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=Perl%20%E5%8E%8B%E7%BC%A9%20Js&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fperl-compression-js%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/perl-compression-js/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>用我喜欢的字体（Cufon）</title>
		<link>http://www.zhangjingwei.com/archives/cufon/</link>
		<comments>http://www.zhangjingwei.com/archives/cufon/#comments</comments>
		<pubDate>Sun, 06 Dec 2009 04:45:21 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[前端技术]]></category>
		<category><![CDATA[cufon]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1307</guid>
		<description><![CDATA[优雅的设计经常包含一些特殊的字体，而这些字体并不存在于用户的字体库中，我们并不能奢求每一个访客都是设计师。  :-) 虽然CSS3标准给我们带来了@font-face属性，但他也仅仅限于使用在“Gecko 1.9.1，Applies to Firefox 3.5, SeaMonkey 2, and Thunderbird 3 and later” 不是Type2呢？不是Firefox3.5呢？显然这并不是一个现实的解决方案，毕竟我们有90%以上的用户在使用IE。 为了解决这个问题，我们使用了sIFR框架，但是这玩意一点也不好，首先是大，其次是慢，而Cufon可以很好的代替它。 什么是 Cufon 呢？Cufon 是一个实现在网页中对文字字体进行渲染的纯 JavaScript 开源类库。 使用Cufon非常简单，只需要在页面中引入Cufon得核心文件，然后在http://cufon.shoqolate.com/generate/ 将你的字体转换为JS字体文件并引用到页面中。 接下来，就可以使用相应的Cufon API对页面中的字体进行渲染了。 那么Cufon是如何对页面字体进行渲染的呢？ 当然是VML、Canvas、SVG，因为网上已经有了相关的文章，所以我就不复制粘贴了。如果你有兴趣，可以看这里了解详细。 最后，因为Cufon是将字体以JSON格式进行编码，所以如果字体是中文的话，这个JS库会增大数倍，使用的时候一定要谨慎。 参考资料： http://www.ibm.com/developerworks/cn/web/0911_zhuzh_cufon/ http://www.mikeindustries.com/blog/sifr/ https://developer.mozilla.org/index.php?title=en/CSS/%40font-face http://wiki.github.com/sorccu/cufon/api 加入书签:]]></description>
			<content:encoded><![CDATA[<p>优雅的设计经常包含一些特殊的字体，而这些字体并不存在于用户的字体库中，我们并不能奢求每一个访客都是设计师。  :-)</p>
<p>虽然CSS3标准给我们带来了@font-face属性，但他也仅仅限于使用在“<a href="https://developer.mozilla.org/index.php?title=en/CSS/%40font-face" target="_blank">Gecko 1.9.1，Applies to Firefox 3.5, SeaMonkey 2, and Thunderbird 3 and later</a>”</p>
<p>不是Type2呢？不是Firefox3.5呢？显然这并不是一个现实的解决方案，毕竟我们有90%以上的用户在使用IE。</p>
<p>为了解决这个问题，我们使用了<a href="http://baike.baidu.com/view/1311052.htm?fr=ala0" target="_blank">sIFR框架</a>，但是这玩意一点也不好，首先是大，其次是慢，而Cufon可以很好的代替它。</p>
<p>什么是 Cufon 呢？Cufon 是一个实现在网页中对文字字体进行渲染的纯 JavaScript 开源类库。</p>
<p>使用Cufon非常简单，只需要在页面中引入Cufon得核心文件，然后在<a href="http://cufon.shoqolate.com/generate/ " target="_blank">http://cufon.shoqolate.com/generate/ </a>将你的字体转换为JS字体文件并引用到页面中。</p>
<p>接下来，就可以使用相应的<a href="http://wiki.github.com/sorccu/cufon/api" target="_blank">Cufon API</a>对页面中的字体进行渲染了。</p>
<p>那么Cufon是如何对页面字体进行渲染的呢？ 当然是VML、Canvas、SVG，因为网上已经有了相关的文章，所以我就不复制粘贴了。如果你有兴趣，可以看<a href="http://www.ibm.com/developerworks/cn/web/0911_zhuzh_cufon/?S_TACT=105AGX52&amp;S_CMP=tec-csdn" target="_blank">这里</a>了解详细。</p>
<p>最后，因为Cufon是将字体以JSON格式进行编码，所以如果字体是中文的话，这个JS库会增大数倍，使用的时候一定要谨慎。</p>
<p>参考资料：<br />
<a href="http://www.ibm.com/developerworks/cn/web/0911_zhuzh_cufon/" target="_blank">http://www.ibm.com/developerworks/cn/web/0911_zhuzh_cufon/</a><br />
<a href="http://www.mikeindustries.com/blog/sifr/" target="_blank">http://www.mikeindustries.com/blog/sifr/</a><br />
<a href="https://developer.mozilla.org/index.php?title=en/CSS/%40font-face" target="_blank">https://developer.mozilla.org/index.php?title=en/CSS/%40font-face</a><br />
<a href="http://wiki.github.com/sorccu/cufon/api" target="_blank">http://wiki.github.com/sorccu/cufon/api</a></p>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=%E7%94%A8%E6%88%91%E5%96%9C%E6%AC%A2%E7%9A%84%E5%AD%97%E4%BD%93%EF%BC%88Cufon%EF%BC%89&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcufon%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcufon%2F&title=%E7%94%A8%E6%88%91%E5%96%9C%E6%AC%A2%E7%9A%84%E5%AD%97%E4%BD%93%EF%BC%88Cufon%EF%BC%89?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcufon%2F&title=%E7%94%A8%E6%88%91%E5%96%9C%E6%AC%A2%E7%9A%84%E5%AD%97%E4%BD%93%EF%BC%88Cufon%EF%BC%89&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcufon%2F&amp;title=%E7%94%A8%E6%88%91%E5%96%9C%E6%AC%A2%E7%9A%84%E5%AD%97%E4%BD%93%EF%BC%88Cufon%EF%BC%89?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=%E7%94%A8%E6%88%91%E5%96%9C%E6%AC%A2%E7%9A%84%E5%AD%97%E4%BD%93%EF%BC%88Cufon%EF%BC%89&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fcufon%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/cufon/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Firefox的新属性 pointer-events</title>
		<link>http://www.zhangjingwei.com/archives/pointer-events/</link>
		<comments>http://www.zhangjingwei.com/archives/pointer-events/#comments</comments>
		<pubDate>Tue, 01 Dec 2009 17:16:02 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[pointer-events]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1297</guid>
		<description><![CDATA[Firefox 3.6 增加了对pointer-events的支持。Opera和safari都可以对svg的pointer-events属性做出支持，这次Firefox把他扩展到了常见的HTML元素上。 pointer-events的语法为 pointer-events: auto &#124; none &#124; visiblePainted &#124; visibleFill &#124; visibleStroke &#124; visible &#124; painted &#124; fill &#124; stroke &#124; all &#124; inherit 其中auto和none可针对所有的元素使用，其它的值只针对SVG。 （as of Firefox 3.6, only the values auto and none apply to all elements. The other values only apply to SVG and behave like auto in other XML [...]]]></description>
			<content:encoded><![CDATA[<p>Firefox 3.6 增加了对<a href="https://developer.mozilla.org/en/CSS/pointer-events" target="_blank">pointer-events</a>的支持。Opera和safari都可以对svg的pointer-events属性做出支持，这次Firefox把他扩展到了常见的HTML元素上。</p>
<p>pointer-events的语法为<br />
pointer-events:  auto | none | visiblePainted | visibleFill | visibleStroke | visible | painted | fill | stroke | all | inherit</p>
<p>其中auto和none可针对所有的元素使用，其它的值只针对SVG。<br />
（as of Firefox 3.6, only the values auto and none apply to all elements. The other values only apply to SVG and behave like auto in other XML and HTML content.）</p>
<p>当使用none的时候，当前节点下的所有子节点不接受event事件。反之则接受。</p>
<p>例如当pointer-events为none时：</p>

<div class="wp_syntax"><div class="code"><pre class="css" style="font-family:monospace;"><span style="color: #cc00cc;">#test</span> <span style="color: #00AA00;">&#123;</span>
    pointer-events<span style="color: #00AA00;">:</span><span style="color: #993333;">none</span><span style="color: #00AA00;">;</span>
  <span style="color: #00AA00;">&#125;</span>
&nbsp;
<span style="color: #cc00cc;">#test</span><span style="color: #3333ff;">:hover </span><span style="color: #00AA00;">&#123;</span>
    <span style="color: #000000; font-weight: bold;">background</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">red</span><span style="color: #00AA00;">;</span>
<span style="color: #00AA00;">&#125;</span></pre></div></div>

<p>鼠标移动到p节点上时将没有不会触发任何事件。</p>
<p>值为auto时：<a href="http://www.zhangjingwei.com/demo/pointer-events/auto.htm" target="_blank">pointer-events/auto.htm</a></p>
<p>值为none时：<a href="http://www.zhangjingwei.com/demo/pointer-events/none.htm" target="_blank">pointer-events/none.htm</a></p>
<p>不过针对HTML元素是Firefox自己创造的新玩意。 ：）</p>
<p>参考：<br />
<a href="http://www.w3.org/TR/SVG/interact.html#PointerEventsProperty" target="_blank">http://www.w3.org/TR/SVG/interact.html#PointerEventsProperty</a><br />
<a href="http://hacks.mozilla.org/2009/12/pointer-events-for-html-in-firefox-3-6/" target="_blank">http://hacks.mozilla.org/2009/12/pointer-events-for-html-in-firefox-3-6/</a><br />
<a href="https://developer.mozilla.org/en/CSS/pointer-events" target="_blank">https://developer.mozilla.org/en/CSS/pointer-events</a></p>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=Firefox%E7%9A%84%E6%96%B0%E5%B1%9E%E6%80%A7%20pointer-events&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fpointer-events%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fpointer-events%2F&title=Firefox%E7%9A%84%E6%96%B0%E5%B1%9E%E6%80%A7%20pointer-events?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fpointer-events%2F&title=Firefox%E7%9A%84%E6%96%B0%E5%B1%9E%E6%80%A7%20pointer-events&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fpointer-events%2F&amp;title=Firefox%E7%9A%84%E6%96%B0%E5%B1%9E%E6%80%A7%20pointer-events?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=Firefox%E7%9A%84%E6%96%B0%E5%B1%9E%E6%80%A7%20pointer-events&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fpointer-events%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/pointer-events/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>纯数字不重复排列的另类方法</title>
		<link>http://www.zhangjingwei.com/archives/%e7%ba%af%e6%95%b0%e5%ad%97%e4%b8%8d%e9%87%8d%e5%a4%8d%e6%8e%92%e5%88%97%e7%9a%84%e7%8c%a5%e7%90%90%e6%96%b9%e6%b3%95/</link>
		<comments>http://www.zhangjingwei.com/archives/%e7%ba%af%e6%95%b0%e5%ad%97%e4%b8%8d%e9%87%8d%e5%a4%8d%e6%8e%92%e5%88%97%e7%9a%84%e7%8c%a5%e7%90%90%e6%96%b9%e6%b3%95/#comments</comments>
		<pubDate>Sun, 29 Nov 2009 06:14:19 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[不重复]]></category>
		<category><![CDATA[排序]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1260</guid>
		<description><![CDATA[方法不是主流的。 有一组数据，大概10万个左右，每一单位的值不会大于30000，要求按照由大到小的顺序不重复输出。 参考无忧cosin的方法后（多谢），整理的方法如下 //一段随机数，模拟用 var baseNum=&#91;&#93;; for&#40;var i= 0;i&#60; 100000 ;i++&#41;&#123; random = Math.floor&#40;Math.random&#40;&#41;*i&#41;; baseNum.push&#40;random&#41;; &#125; var baseNumLen = baseNum.length; var numSubscript = &#91;&#93;; //将数字作为下标和值放到另一数组内，实现排序和不重复 for &#40;var i =0;i&#60;basenumlen ;i++&#41;&#123; if&#40;numSubscript&#91;baseNum&#91;i&#93;&#93; == undefined&#41;numSubscript&#91;baseNum&#91;i&#93;&#93;=baseNum&#91;i&#93;; &#125; //去除空的值并颠倒一下 baseNum = numSubscript.join&#40;','&#41;.replace&#40;/([,]+)/ig, ','&#41;.split&#40;','&#41;.reverse&#40;&#41;; document.write&#40;baseNum&#41;; 题外： 假如数组是自己生成，客服果果写的这段代码就很好了。（牛逼） var baseNum=&#91;&#93;,tmp=&#123;&#125;,v; for&#40;var i= 0;i&#60; 100000 ;i++&#41;&#123; tmp&#91;Math.floor&#40;Math.random&#40;&#41;*i&#41;&#93;=true; &#125;; i=0; for &#40;var k [...]]]></description>
			<content:encoded><![CDATA[<p>方法不是主流的。</p>
<p>有一组数据，大概10万个左右，每一单位的值不会大于30000，要求按照由大到小的顺序不重复输出。</p>
<p>参考无忧cosin的方法后（多谢），整理的方法如下</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">//一段随机数，模拟用</span>
<span style="color: #003366; font-weight: bold;">var</span> baseNum<span style="color: #339933;">=</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span>
<span style="color: #000066; font-weight: bold;">for</span><span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">var</span> i<span style="color: #339933;">=</span> <span style="color: #CC0000;">0</span><span style="color: #339933;">;</span>i<span style="color: #339933;">&lt;</span> <span style="color: #CC0000;">100000</span> <span style="color: #339933;">;</span>i<span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
 random <span style="color: #339933;">=</span> Math.<span style="color: #660066;">floor</span><span style="color: #009900;">&#40;</span>Math.<span style="color: #660066;">random</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">*</span>i<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
 baseNum.<span style="color: #660066;">push</span><span style="color: #009900;">&#40;</span>random<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #003366; font-weight: bold;">var</span> baseNumLen <span style="color: #339933;">=</span> baseNum.<span style="color: #660066;">length</span><span style="color: #339933;">;</span>
<span style="color: #003366; font-weight: bold;">var</span> numSubscript <span style="color: #339933;">=</span> <span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">//将数字作为下标和值放到另一数组内，实现排序和不重复</span>
<span style="color: #000066; font-weight: bold;">for</span> <span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">var</span> i <span style="color: #339933;">=</span><span style="color: #CC0000;">0</span><span style="color: #339933;">;</span>i<span style="color: #339933;">&lt;</span>basenumlen <span style="color: #339933;">;</span>i<span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
 <span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span>numSubscript<span style="color: #009900;">&#91;</span>baseNum<span style="color: #009900;">&#91;</span>i<span style="color: #009900;">&#93;</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">==</span> undefined<span style="color: #009900;">&#41;</span>numSubscript<span style="color: #009900;">&#91;</span>baseNum<span style="color: #009900;">&#91;</span>i<span style="color: #009900;">&#93;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">=</span>baseNum<span style="color: #009900;">&#91;</span>i<span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
<span style="color: #006600; font-style: italic;">//去除空的值并颠倒一下</span>
baseNum <span style="color: #339933;">=</span> numSubscript.<span style="color: #660066;">join</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">','</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">replace</span><span style="color: #009900;">&#40;</span><span style="color: #009966; font-style: italic;">/([,]+)/ig</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">','</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">split</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">','</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">reverse</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
document.<span style="color: #000066; font-weight: bold;">write</span><span style="color: #009900;">&#40;</span>baseNum<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

</pre>
<pre>题外：
假如数组是自己生成，客服果果写的这段代码就很好了。（牛逼）</pre>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> baseNum<span style="color: #339933;">=</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span>tmp<span style="color: #339933;">=</span><span style="color: #009900;">&#123;</span><span style="color: #009900;">&#125;</span><span style="color: #339933;">,</span>v<span style="color: #339933;">;</span>
<span style="color: #000066; font-weight: bold;">for</span><span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">var</span> i<span style="color: #339933;">=</span> <span style="color: #CC0000;">0</span><span style="color: #339933;">;</span>i<span style="color: #339933;">&lt;</span> <span style="color: #CC0000;">100000</span> <span style="color: #339933;">;</span>i<span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
        tmp<span style="color: #009900;">&#91;</span>Math.<span style="color: #660066;">floor</span><span style="color: #009900;">&#40;</span>Math.<span style="color: #660066;">random</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">*</span>i<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">=</span><span style="color: #003366; font-weight: bold;">true</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span>
i<span style="color: #339933;">=</span><span style="color: #CC0000;">0</span><span style="color: #339933;">;</span>
<span style="color: #000066; font-weight: bold;">for</span> <span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">var</span> k <span style="color: #000066; font-weight: bold;">in</span> tmp<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
        baseNum<span style="color: #009900;">&#91;</span>i<span style="color: #339933;">++</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">=</span>k<span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span>
baseNum.<span style="color: #660066;">sort</span><span style="color: #009900;">&#40;</span>fn<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #003366; font-weight: bold;">function</span> fn<span style="color: #009900;">&#40;</span>x<span style="color: #339933;">,</span>y<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
        <span style="color: #000066; font-weight: bold;">return</span> x<span style="color: #339933;">-</span>y<span style="color: #339933;">&amp;</span>gt<span style="color: #339933;">;</span><span style="color: #CC0000;">0</span><span style="color: #339933;">?</span><span style="color: #CC0000;">1</span><span style="color: #339933;">:-</span><span style="color: #CC0000;">1</span>
<span style="color: #009900;">&#125;</span>
document.<span style="color: #000066; font-weight: bold;">write</span><span style="color: #009900;">&#40;</span>baseNum.<span style="color: #660066;">join</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">''</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

</pre>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=%E7%BA%AF%E6%95%B0%E5%AD%97%E4%B8%8D%E9%87%8D%E5%A4%8D%E6%8E%92%E5%88%97%E7%9A%84%E5%8F%A6%E7%B1%BB%E6%96%B9%E6%B3%95&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e7%25ba%25af%25e6%2595%25b0%25e5%25ad%2597%25e4%25b8%258d%25e9%2587%258d%25e5%25a4%258d%25e6%258e%2592%25e5%2588%2597%25e7%259a%2584%25e7%258c%25a5%25e7%2590%2590%25e6%2596%25b9%25e6%25b3%2595%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e7%25ba%25af%25e6%2595%25b0%25e5%25ad%2597%25e4%25b8%258d%25e9%2587%258d%25e5%25a4%258d%25e6%258e%2592%25e5%2588%2597%25e7%259a%2584%25e7%258c%25a5%25e7%2590%2590%25e6%2596%25b9%25e6%25b3%2595%2F&title=%E7%BA%AF%E6%95%B0%E5%AD%97%E4%B8%8D%E9%87%8D%E5%A4%8D%E6%8E%92%E5%88%97%E7%9A%84%E5%8F%A6%E7%B1%BB%E6%96%B9%E6%B3%95?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e7%25ba%25af%25e6%2595%25b0%25e5%25ad%2597%25e4%25b8%258d%25e9%2587%258d%25e5%25a4%258d%25e6%258e%2592%25e5%2588%2597%25e7%259a%2584%25e7%258c%25a5%25e7%2590%2590%25e6%2596%25b9%25e6%25b3%2595%2F&title=%E7%BA%AF%E6%95%B0%E5%AD%97%E4%B8%8D%E9%87%8D%E5%A4%8D%E6%8E%92%E5%88%97%E7%9A%84%E5%8F%A6%E7%B1%BB%E6%96%B9%E6%B3%95&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e7%25ba%25af%25e6%2595%25b0%25e5%25ad%2597%25e4%25b8%258d%25e9%2587%258d%25e5%25a4%258d%25e6%258e%2592%25e5%2588%2597%25e7%259a%2584%25e7%258c%25a5%25e7%2590%2590%25e6%2596%25b9%25e6%25b3%2595%2F&amp;title=%E7%BA%AF%E6%95%B0%E5%AD%97%E4%B8%8D%E9%87%8D%E5%A4%8D%E6%8E%92%E5%88%97%E7%9A%84%E5%8F%A6%E7%B1%BB%E6%96%B9%E6%B3%95?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=%E7%BA%AF%E6%95%B0%E5%AD%97%E4%B8%8D%E9%87%8D%E5%A4%8D%E6%8E%92%E5%88%97%E7%9A%84%E5%8F%A6%E7%B1%BB%E6%96%B9%E6%B3%95&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e7%25ba%25af%25e6%2595%25b0%25e5%25ad%2597%25e4%25b8%258d%25e9%2587%258d%25e5%25a4%258d%25e6%258e%2592%25e5%2588%2597%25e7%259a%2584%25e7%258c%25a5%25e7%2590%2590%25e6%2596%25b9%25e6%25b3%2595%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/%e7%ba%af%e6%95%b0%e5%ad%97%e4%b8%8d%e9%87%8d%e5%a4%8d%e6%8e%92%e5%88%97%e7%9a%84%e7%8c%a5%e7%90%90%e6%96%b9%e6%b3%95/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>jQuery Select(单选) 模拟插件 V1.3.6</title>
		<link>http://www.zhangjingwei.com/archives/jquery-select%e5%8d%95%e9%80%89-%e6%a8%a1%e6%8b%9f%e6%8f%92%e4%bb%b6-v1-3-6/</link>
		<comments>http://www.zhangjingwei.com/archives/jquery-select%e5%8d%95%e9%80%89-%e6%a8%a1%e6%8b%9f%e6%8f%92%e4%bb%b6-v1-3-6/#comments</comments>
		<pubDate>Sat, 14 Nov 2009 12:50:24 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[select]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1255</guid>
		<description><![CDATA[a、增加了onchange事件。（谢谢fjgysai） b、可以支持方法连缀了。 c、修正opera下的笔误。 d、可支持jQuery的选择器了 下载地址：http://www.zhangjingwei.com/demo/jQuery.Select/index.html 您可以自由的使用这个插件在任何项目上。（商业、非商业） 希望您可以补充完善这个插件。 加入书签:]]></description>
			<content:encoded><![CDATA[<p>a、增加了onchange事件。（谢谢fjgysai）</p>
<p>b、可以支持方法连缀了。</p>
<p>c、修正opera下的笔误。</p>
<p>d、可支持jQuery的选择器了</p>
<p>下载地址：<a href="http://www.zhangjingwei.com/demo/jQuery.Select/index.html" target="_blank">http://www.zhangjingwei.com/demo/jQuery.Select/index.html</a></p>
<p><em>您可以自由的使用这个插件在任何项目上。（商业、非商业）<br />
希望您可以补充完善这个插件。</em></p>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=jQuery%20Select%28%E5%8D%95%E9%80%89%29%20%E6%A8%A1%E6%8B%9F%E6%8F%92%E4%BB%B6%20V1.3.6&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-select%25e5%258d%2595%25e9%2580%2589-%25e6%25a8%25a1%25e6%258b%259f%25e6%258f%2592%25e4%25bb%25b6-v1-3-6%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-select%25e5%258d%2595%25e9%2580%2589-%25e6%25a8%25a1%25e6%258b%259f%25e6%258f%2592%25e4%25bb%25b6-v1-3-6%2F&title=jQuery%20Select%28%E5%8D%95%E9%80%89%29%20%E6%A8%A1%E6%8B%9F%E6%8F%92%E4%BB%B6%20V1.3.6?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-select%25e5%258d%2595%25e9%2580%2589-%25e6%25a8%25a1%25e6%258b%259f%25e6%258f%2592%25e4%25bb%25b6-v1-3-6%2F&title=jQuery%20Select%28%E5%8D%95%E9%80%89%29%20%E6%A8%A1%E6%8B%9F%E6%8F%92%E4%BB%B6%20V1.3.6&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-select%25e5%258d%2595%25e9%2580%2589-%25e6%25a8%25a1%25e6%258b%259f%25e6%258f%2592%25e4%25bb%25b6-v1-3-6%2F&amp;title=jQuery%20Select%28%E5%8D%95%E9%80%89%29%20%E6%A8%A1%E6%8B%9F%E6%8F%92%E4%BB%B6%20V1.3.6?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=jQuery%20Select%28%E5%8D%95%E9%80%89%29%20%E6%A8%A1%E6%8B%9F%E6%8F%92%E4%BB%B6%20V1.3.6&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fjquery-select%25e5%258d%2595%25e9%2580%2589-%25e6%25a8%25a1%25e6%258b%259f%25e6%258f%2592%25e4%25bb%25b6-v1-3-6%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/jquery-select%e5%8d%95%e9%80%89-%e6%a8%a1%e6%8b%9f%e6%8f%92%e4%bb%b6-v1-3-6/feed/</wfw:commentRss>
		<slash:comments>22</slash:comments>
		</item>
		<item>
		<title>Date对象格式化方法</title>
		<link>http://www.zhangjingwei.com/archives/date%e5%af%b9%e8%b1%a1%e6%a0%bc%e5%bc%8f%e5%8c%96%e6%96%b9%e6%b3%95/</link>
		<comments>http://www.zhangjingwei.com/archives/date%e5%af%b9%e8%b1%a1%e6%a0%bc%e5%bc%8f%e5%8c%96%e6%96%b9%e6%b3%95/#comments</comments>
		<pubDate>Tue, 03 Nov 2009 02:03:05 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[data]]></category>
		<category><![CDATA[javascript]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1251</guid>
		<description><![CDATA[/* * Date Format 1.2.3 * (c) 2007-2009 Steven Levithan * MIT license * * Includes enhancements by Scott Trenda * and Kris Kowal * * Accepts a date, a mask, or a date and a mask. * Returns a formatted version of the given date. * The date defaults to the current date/time. * [...]]]></description>
			<content:encoded><![CDATA[
<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">/*
 * Date Format 1.2.3
 * (c) 2007-2009 Steven Levithan
 * MIT license
 *
 * Includes enhancements by Scott Trenda
 * and Kris Kowal
 *
 * Accepts a date, a mask, or a date and a mask.
 * Returns a formatted version of the given date.
 * The date defaults to the current date/time.
 * The mask defaults to dateFormat.masks.default.
 */</span>
&nbsp;
<span style="color: #003366; font-weight: bold;">var</span> dateFormat <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span> <span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
	<span style="color: #003366; font-weight: bold;">var</span>	token <span style="color: #339933;">=</span> <span style="color: #009966; font-style: italic;">/d{1,4}|m{1,4}|yy(?:yy)?|([HhMsTt])\1?|[LloSZ]|&quot;[^&quot;]*&quot;|'[^']*'/g</span><span style="color: #339933;">,</span>
		timezone <span style="color: #339933;">=</span> <span style="color: #009966; font-style: italic;">/\b(?:[PMCEA][SDP]T|(?:Pacific|Mountain|Central|Eastern|Atlantic) (?:Standard|Daylight|Prevailing) Time|(?:GMT|UTC)(?:[-+]\d{4})?)\b/g</span><span style="color: #339933;">,</span>
		timezoneClip <span style="color: #339933;">=</span> <span style="color: #009966; font-style: italic;">/[^-+\dA-Z]/g</span><span style="color: #339933;">,</span>
		pad <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span> <span style="color: #009900;">&#40;</span>val<span style="color: #339933;">,</span> len<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
			val <span style="color: #339933;">=</span> String<span style="color: #009900;">&#40;</span>val<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
			len <span style="color: #339933;">=</span> len <span style="color: #339933;">||</span> <span style="color: #CC0000;">2</span><span style="color: #339933;">;</span>
			<span style="color: #000066; font-weight: bold;">while</span> <span style="color: #009900;">&#40;</span>val.<span style="color: #660066;">length</span> <span style="color: #339933;">&amp;</span>lt<span style="color: #339933;">;</span> len<span style="color: #009900;">&#41;</span> val <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;0&quot;</span> <span style="color: #339933;">+</span> val<span style="color: #339933;">;</span> 			<span style="color: #000066; font-weight: bold;">return</span> val<span style="color: #339933;">;</span> 		<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span> 	<span style="color: #006600; font-style: italic;">// Regexes and supporting functions are cached through closure 	return function (date, mask, utc) { 		var dF = dateFormat; 		// You can't provide utc if you skip other args (use the &quot;UTC:&quot; mask prefix) 		if (arguments.length == 1 &amp;amp;&amp;amp; Object.prototype.toString.call(date) == &quot;[object String]&quot; &amp;amp;&amp;amp; !/\d/.test(date)) { 			mask = date; 			date = undefined; 		} 		// Passing date through Date applies Date.parse, if necessary 		date = date ? new Date(date) : new Date; 		if (isNaN(date)) throw SyntaxError(&quot;invalid date&quot;); 		mask = String(dF.masks[mask] || mask || dF.masks[&quot;default&quot;]); 		// Allow setting the utc argument via the mask 		if (mask.slice(0, 4) == &quot;UTC:&quot;) { 			mask = mask.slice(4); 			utc = true; 		} 		var	_ = utc ? &quot;getUTC&quot; : &quot;get&quot;, 			d = date[_ + &quot;Date&quot;](), 			D = date[_ + &quot;Day&quot;](), 			m = date[_ + &quot;Month&quot;](), 			y = date[_ + &quot;FullYear&quot;](), 			H = date[_ + &quot;Hours&quot;](), 			M = date[_ + &quot;Minutes&quot;](), 			s = date[_ + &quot;Seconds&quot;](), 			L = date[_ + &quot;Milliseconds&quot;](), 			o = utc ? 0 : date.getTimezoneOffset(), 			flags = { 				d:    d, 				dd:   pad(d), 				ddd:  dF.i18n.dayNames[D], 				dddd: dF.i18n.dayNames[D + 7], 				m:    m + 1, 				mm:   pad(m + 1), 				mmm:  dF.i18n.monthNames[m], 				mmmm: dF.i18n.monthNames[m + 12], 				yy:   String(y).slice(2), 				yyyy: y, 				h:    H % 12 || 12, 				hh:   pad(H % 12 || 12), 				H:    H, 				HH:   pad(H), 				M:    M, 				MM:   pad(M), 				s:    s, 				ss:   pad(s), 				l:    pad(L, 3), 				L:    pad(L &amp;gt; 99 ? Math.round(L / 10) : L),</span>
				t<span style="color: #339933;">:</span>    H <span style="color: #339933;">&amp;</span>lt<span style="color: #339933;">;</span> <span style="color: #CC0000;">12</span> <span style="color: #339933;">?</span> <span style="color: #3366CC;">&quot;a&quot;</span>  <span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;p&quot;</span><span style="color: #339933;">,</span>
				tt<span style="color: #339933;">:</span>   H <span style="color: #339933;">&amp;</span>lt<span style="color: #339933;">;</span> <span style="color: #CC0000;">12</span> <span style="color: #339933;">?</span> <span style="color: #3366CC;">&quot;am&quot;</span> <span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;pm&quot;</span><span style="color: #339933;">,</span>
				T<span style="color: #339933;">:</span>    H <span style="color: #339933;">&amp;</span>lt<span style="color: #339933;">;</span> <span style="color: #CC0000;">12</span> <span style="color: #339933;">?</span> <span style="color: #3366CC;">&quot;A&quot;</span>  <span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;P&quot;</span><span style="color: #339933;">,</span>
				TT<span style="color: #339933;">:</span>   H <span style="color: #339933;">&amp;</span>lt<span style="color: #339933;">;</span> <span style="color: #CC0000;">12</span> <span style="color: #339933;">?</span> <span style="color: #3366CC;">&quot;AM&quot;</span> <span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;PM&quot;</span><span style="color: #339933;">,</span> 				Z<span style="color: #339933;">:</span>    utc <span style="color: #339933;">?</span> <span style="color: #3366CC;">&quot;UTC&quot;</span> <span style="color: #339933;">:</span> <span style="color: #009900;">&#40;</span>String<span style="color: #009900;">&#40;</span>date<span style="color: #009900;">&#41;</span>.<span style="color: #660066;">match</span><span style="color: #009900;">&#40;</span>timezone<span style="color: #009900;">&#41;</span> <span style="color: #339933;">||</span> <span style="color: #009900;">&#91;</span><span style="color: #3366CC;">&quot;&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">pop</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">replace</span><span style="color: #009900;">&#40;</span>timezoneClip<span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span> 				o<span style="color: #339933;">:</span>    <span style="color: #009900;">&#40;</span>o <span style="color: #339933;">&amp;</span>gt<span style="color: #339933;">;</span> <span style="color: #CC0000;">0</span> <span style="color: #339933;">?</span> <span style="color: #3366CC;">&quot;-&quot;</span> <span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;+&quot;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">+</span> pad<span style="color: #009900;">&#40;</span>Math.<span style="color: #660066;">floor</span><span style="color: #009900;">&#40;</span>Math.<span style="color: #660066;">abs</span><span style="color: #009900;">&#40;</span>o<span style="color: #009900;">&#41;</span> <span style="color: #339933;">/</span> <span style="color: #CC0000;">60</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color: #CC0000;">100</span> <span style="color: #339933;">+</span> Math.<span style="color: #660066;">abs</span><span style="color: #009900;">&#40;</span>o<span style="color: #009900;">&#41;</span> <span style="color: #339933;">%</span> <span style="color: #CC0000;">60</span><span style="color: #339933;">,</span> <span style="color: #CC0000;">4</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
				S<span style="color: #339933;">:</span>    <span style="color: #009900;">&#91;</span><span style="color: #3366CC;">&quot;th&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;st&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;nd&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;rd&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #009900;">&#91;</span>d <span style="color: #339933;">%</span> <span style="color: #CC0000;">10</span> <span style="color: #339933;">&amp;</span>gt<span style="color: #339933;">;</span> <span style="color: #CC0000;">3</span> <span style="color: #339933;">?</span> <span style="color: #CC0000;">0</span> <span style="color: #339933;">:</span> <span style="color: #009900;">&#40;</span>d <span style="color: #339933;">%</span> <span style="color: #CC0000;">100</span> <span style="color: #339933;">-</span> d <span style="color: #339933;">%</span> <span style="color: #CC0000;">10</span> <span style="color: #339933;">!=</span> <span style="color: #CC0000;">10</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> d <span style="color: #339933;">%</span> <span style="color: #CC0000;">10</span><span style="color: #009900;">&#93;</span>
			<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span>
&nbsp;
		<span style="color: #000066; font-weight: bold;">return</span> mask.<span style="color: #660066;">replace</span><span style="color: #009900;">&#40;</span>token<span style="color: #339933;">,</span> <span style="color: #003366; font-weight: bold;">function</span> <span style="color: #009900;">&#40;</span>$<span style="color: #CC0000;">0</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
			<span style="color: #000066; font-weight: bold;">return</span> $<span style="color: #CC0000;">0</span> <span style="color: #000066; font-weight: bold;">in</span> flags <span style="color: #339933;">?</span> flags<span style="color: #009900;">&#91;</span>$<span style="color: #CC0000;">0</span><span style="color: #009900;">&#93;</span> <span style="color: #339933;">:</span> $0.<span style="color: #660066;">slice</span><span style="color: #009900;">&#40;</span><span style="color: #CC0000;">1</span><span style="color: #339933;">,</span> $0.<span style="color: #660066;">length</span> <span style="color: #339933;">-</span> <span style="color: #CC0000;">1</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// Some common format strings</span>
dateFormat.<span style="color: #660066;">masks</span> <span style="color: #339933;">=</span> <span style="color: #009900;">&#123;</span>
	<span style="color: #3366CC;">&quot;default&quot;</span><span style="color: #339933;">:</span>      <span style="color: #3366CC;">&quot;ddd mmm dd yyyy HH:MM:ss&quot;</span><span style="color: #339933;">,</span>
	shortDate<span style="color: #339933;">:</span>      <span style="color: #3366CC;">&quot;m/d/yy&quot;</span><span style="color: #339933;">,</span>
	mediumDate<span style="color: #339933;">:</span>     <span style="color: #3366CC;">&quot;mmm d, yyyy&quot;</span><span style="color: #339933;">,</span>
	longDate<span style="color: #339933;">:</span>       <span style="color: #3366CC;">&quot;mmmm d, yyyy&quot;</span><span style="color: #339933;">,</span>
	fullDate<span style="color: #339933;">:</span>       <span style="color: #3366CC;">&quot;dddd, mmmm d, yyyy&quot;</span><span style="color: #339933;">,</span>
	shortTime<span style="color: #339933;">:</span>      <span style="color: #3366CC;">&quot;h:MM TT&quot;</span><span style="color: #339933;">,</span>
	mediumTime<span style="color: #339933;">:</span>     <span style="color: #3366CC;">&quot;h:MM:ss TT&quot;</span><span style="color: #339933;">,</span>
	longTime<span style="color: #339933;">:</span>       <span style="color: #3366CC;">&quot;h:MM:ss TT Z&quot;</span><span style="color: #339933;">,</span>
	isoDate<span style="color: #339933;">:</span>        <span style="color: #3366CC;">&quot;yyyy-mm-dd&quot;</span><span style="color: #339933;">,</span>
	isoTime<span style="color: #339933;">:</span>        <span style="color: #3366CC;">&quot;HH:MM:ss&quot;</span><span style="color: #339933;">,</span>
	isoDateTime<span style="color: #339933;">:</span>    <span style="color: #3366CC;">&quot;yyyy-mm-dd'T'HH:MM:ss&quot;</span><span style="color: #339933;">,</span>
	isoUtcDateTime<span style="color: #339933;">:</span> <span style="color: #3366CC;">&quot;UTC:yyyy-mm-dd'T'HH:MM:ss'Z'&quot;</span>
<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// Internationalization strings</span>
dateFormat.<span style="color: #660066;">i18n</span> <span style="color: #339933;">=</span> <span style="color: #009900;">&#123;</span>
	dayNames<span style="color: #339933;">:</span> <span style="color: #009900;">&#91;</span>
		<span style="color: #3366CC;">&quot;Sun&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Mon&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Tue&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Wed&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Thu&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Fri&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Sat&quot;</span><span style="color: #339933;">,</span>
		<span style="color: #3366CC;">&quot;Sunday&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Monday&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Tuesday&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Wednesday&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Thursday&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Friday&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Saturday&quot;</span>
	<span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span>
	monthNames<span style="color: #339933;">:</span> <span style="color: #009900;">&#91;</span>
		<span style="color: #3366CC;">&quot;Jan&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Feb&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Mar&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Apr&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;May&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Jun&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Jul&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Aug&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Sep&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Oct&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Nov&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;Dec&quot;</span><span style="color: #339933;">,</span>
		<span style="color: #3366CC;">&quot;January&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;February&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;March&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;April&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;May&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;June&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;July&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;August&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;September&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;October&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;November&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;December&quot;</span>
	<span style="color: #009900;">&#93;</span>
<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// For convenience...</span>
Date.<span style="color: #660066;">prototype</span>.<span style="color: #660066;">format</span> <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span> <span style="color: #009900;">&#40;</span>mask<span style="color: #339933;">,</span> utc<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
	<span style="color: #000066; font-weight: bold;">return</span> dateFormat<span style="color: #009900;">&#40;</span><span style="color: #000066; font-weight: bold;">this</span><span style="color: #339933;">,</span> mask<span style="color: #339933;">,</span> utc<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span></pre></div></div>

<p><span id="more-1251"></span>用法：</p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> now <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">new</span> Date<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
now.<span style="color: #660066;">format</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;m/dd/yy&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// Returns, e.g., 6/09/07</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// Can also be used as a standalone function</span>
dateFormat<span style="color: #009900;">&#40;</span>now<span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;dddd, mmmm dS, yyyy, h:MM:ss TT&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// Saturday, June 9th, 2007, 5:46:21 PM</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// You can use one of several named masks</span>
now.<span style="color: #660066;">format</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;isoDateTime&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// 2007-06-09T17:46:21</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// ...Or add your own</span>
dateFormat.<span style="color: #660066;">masks</span>.<span style="color: #660066;">hammerTime</span> <span style="color: #339933;">=</span> <span style="color: #3366CC;">'HH:MM! &quot;Can<span style="color: #000099; font-weight: bold;">\'</span>t touch this!&quot;'</span><span style="color: #339933;">;</span>
now.<span style="color: #660066;">format</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;hammerTime&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// 17:46! Can't touch this!</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// When using the standalone dateFormat function,</span>
<span style="color: #006600; font-style: italic;">// you can also provide the date as a string</span>
dateFormat<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;Jun 9 2007&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;fullDate&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// Saturday, June 9, 2007</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// Note that if you don't include the mask argument,</span>
<span style="color: #006600; font-style: italic;">// dateFormat.masks.default is used</span>
now.<span style="color: #660066;">format</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// Sat Jun 09 2007 17:46:21</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// And if you don't include the date argument,</span>
<span style="color: #006600; font-style: italic;">// the current date and time is used</span>
dateFormat<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// Sat Jun 09 2007 17:46:22</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// You can also skip the date argument (as long as your mask doesn't</span>
<span style="color: #006600; font-style: italic;">// contain any numbers), in which case the current date/time is used</span>
dateFormat<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;longTime&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// 5:46:22 PM EST</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// And finally, you can convert local time to UTC time. Either pass in</span>
<span style="color: #006600; font-style: italic;">// true as an additional argument (no argument skipping allowed in this case):</span>
dateFormat<span style="color: #009900;">&#40;</span>now<span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;longTime&quot;</span><span style="color: #339933;">,</span> <span style="color: #003366; font-weight: bold;">true</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
now.<span style="color: #660066;">format</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;longTime&quot;</span><span style="color: #339933;">,</span> <span style="color: #003366; font-weight: bold;">true</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// Both lines return, e.g., 10:46:21 PM UTC</span>
&nbsp;
<span style="color: #006600; font-style: italic;">// ...Or add the prefix &quot;UTC:&quot; to your mask.</span>
now.<span style="color: #660066;">format</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;UTC:h:MM:ss TT Z&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">// 10:46:21 PM UTC</span></pre></div></div>

<p> </p>
<table cellspacing="0" summary="Date Format mask metasequences">
<thead>
<tr>
<th>Mask</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><code>d</code></td>
<td>Day of the month as digits; no leading zero for single-digit days.</td>
</tr>
<tr class="altBg">
<td><code>dd</code></td>
<td>Day of the month as digits; leading zero for single-digit days.</td>
</tr>
<tr>
<td><code>ddd</code></td>
<td>Day of the week as a three-letter abbreviation.</td>
</tr>
<tr class="altBg">
<td><code>dddd</code></td>
<td>Day of the week as its full name.</td>
</tr>
<tr>
<td><code>m</code></td>
<td>Month as digits; no leading zero for single-digit months.</td>
</tr>
<tr class="altBg">
<td><code>mm</code></td>
<td>Month as digits; leading zero for single-digit months.</td>
</tr>
<tr>
<td><code>mmm</code></td>
<td>Month as a three-letter abbreviation.</td>
</tr>
<tr class="altBg">
<td><code>mmmm</code></td>
<td>Month as its full name.</td>
</tr>
<tr>
<td><code>yy</code></td>
<td>Year as last two digits; leading zero for years less than 10.</td>
</tr>
<tr class="altBg">
<td><code>yyyy</code></td>
<td>Year represented by four digits.</td>
</tr>
<tr>
<td><code>h</code></td>
<td>Hours; no leading zero for single-digit hours (12-hour clock).</td>
</tr>
<tr class="altBg">
<td><code>hh</code></td>
<td>Hours; leading zero for single-digit hours (12-hour clock).</td>
</tr>
<tr>
<td><code>H</code></td>
<td>Hours; no leading zero for single-digit hours (24-hour clock).</td>
</tr>
<tr class="altBg">
<td><code>HH</code></td>
<td>Hours; leading zero for single-digit hours (24-hour clock).</td>
</tr>
<tr>
<td><code>M</code></td>
<td>Minutes; no leading zero for single-digit minutes.<br />
				<span class="small">Uppercase M unlike CF <code>timeFormat</code>&#8216;s m to avoid conflict with months.</span></td>
</tr>
<tr class="altBg">
<td><code>MM</code></td>
<td>Minutes; leading zero for single-digit minutes.<br />
				<span class="small">Uppercase MM unlike CF <code>timeFormat</code>&#8216;s mm to avoid conflict with months.</span></td>
</tr>
<tr>
<td><code>s</code></td>
<td>Seconds; no leading zero for single-digit seconds.</td>
</tr>
<tr class="altBg">
<td><code>ss</code></td>
<td>Seconds; leading zero for single-digit seconds.</td>
</tr>
<tr>
<td><code>l</code> <em>or</em> <code>L</code></td>
<td>Milliseconds. <code>l</code> gives 3 digits. <code>L</code> gives 2 digits.</td>
</tr>
<tr class="altBg">
<td><code>t</code></td>
<td>Lowercase, single-character time marker string: <em>a</em> or <em>p</em>.<br />
				<span class="small">No equivalent in CF.</span></td>
</tr>
<tr>
<td><code>tt</code></td>
<td>Lowercase, two-character time marker string: <em>am</em> or <em>pm</em>.<br />
				<span class="small">No equivalent in CF.</span></td>
</tr>
<tr class="altBg">
<td><code>T</code></td>
<td>Uppercase, single-character time marker string: <em>A</em> or <em>P</em>.<br />
				<span class="small">Uppercase T unlike CF&#8217;s t to allow for user-specified casing.</span></td>
</tr>
<tr>
<td><code>TT</code></td>
<td>Uppercase, two-character time marker string: <em>AM</em> or <em>PM</em>.<br />
				<span class="small">Uppercase TT unlike CF&#8217;s tt to allow for user-specified casing.</span></td>
</tr>
<tr class="altBg">
<td><code>Z</code></td>
<td>US timezone abbreviation, e.g. <em>EST</em> or <em>MDT</em>. With non-US timezones or in the Opera browser, the GMT/UTC offset is returned, e.g. <em>GMT-0500</em><br />
				<span class="small">No equivalent in CF.</span></td>
</tr>
<tr>
<td><code>o</code></td>
<td>GMT/UTC timezone offset, e.g. <em>-0500</em> or <em>+0230</em>.<br />
				<span class="small">No equivalent in CF.</span></td>
</tr>
<tr class="altBg">
<td><code>S</code></td>
<td>The date&#8217;s ordinal suffix (<em>st</em>, <em>nd</em>, <em>rd</em>, or <em>th</em>). Works well with <code>d</code>.<br />
				<span class="small">No equivalent in CF.</span></td>
</tr>
<tr>
<td><code>'&hellip;'</code> <em>or</em> <code>"&hellip;"</code></td>
<td>Literal character sequence. Surrounding quotes are removed.<br />
				<span class="small">No equivalent in CF.</span></td>
</tr>
<tr class="altBg">
<td><code>UTC:</code></td>
<td>Must be the first four characters of the mask. Converts the date from local time to UTC/GMT/Zulu time before applying the mask. The &#8220;UTC:&#8221; prefix is removed.<br />
				<span class="small">No equivalent in CF.</span></td>
</tr>
</tbody>
</table>
<table cellspacing="0" summary="Date Format named masks">
<thead>
<tr>
<th>Name</th>
<th>Mask</th>
<th>Example</th>
</tr>
</thead>
<tbody>
<tr>
<td>default</td>
<td>ddd mmm dd yyyy HH:MM:ss</td>
<td>Sat Jun 09 2007 17:46:21</td>
</tr>
<tr class="altBg">
<td>shortDate</td>
<td>m/d/yy</td>
<td>6/9/07</td>
</tr>
<tr>
<td>mediumDate</td>
<td>mmm d, yyyy</td>
<td>Jun 9, 2007</td>
</tr>
<tr class="altBg">
<td>longDate</td>
<td>mmmm d, yyyy</td>
<td>June 9, 2007</td>
</tr>
<tr>
<td>fullDate</td>
<td>dddd, mmmm d, yyyy</td>
<td>Saturday, June 9, 2007</td>
</tr>
<tr class="altBg">
<td>shortTime</td>
<td>h:MM TT</td>
<td>5:46 PM</td>
</tr>
<tr>
<td>mediumTime</td>
<td>h:MM:ss TT</td>
<td>5:46:21 PM</td>
</tr>
<tr class="altBg">
<td>longTime</td>
<td>h:MM:ss TT Z</td>
<td>5:46:21 PM EST</td>
</tr>
<tr>
<td>isoDate</td>
<td>yyyy-mm-dd</td>
<td>2007-06-09</td>
</tr>
<tr class="altBg">
<td>isoTime</td>
<td>HH:MM:ss</td>
<td>17:46:21</td>
</tr>
<tr>
<td>isoDateTime</td>
<td>yyyy-mm-dd&#8217;T'HH:MM:ss</td>
<td>2007-06-09T17:46:21</td>
</tr>
<tr class="altBg">
<td>isoUtcDateTime</td>
<td>UTC:yyyy-mm-dd&#8217;T'HH:MM:ss&#8217;Z&#8217;</td>
<td>2007-06-09T22:46:21Z</td>
</tr>
</tbody>
</table>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=Date%E5%AF%B9%E8%B1%A1%E6%A0%BC%E5%BC%8F%E5%8C%96%E6%96%B9%E6%B3%95&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fdate%25e5%25af%25b9%25e8%25b1%25a1%25e6%25a0%25bc%25e5%25bc%258f%25e5%258c%2596%25e6%2596%25b9%25e6%25b3%2595%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fdate%25e5%25af%25b9%25e8%25b1%25a1%25e6%25a0%25bc%25e5%25bc%258f%25e5%258c%2596%25e6%2596%25b9%25e6%25b3%2595%2F&title=Date%E5%AF%B9%E8%B1%A1%E6%A0%BC%E5%BC%8F%E5%8C%96%E6%96%B9%E6%B3%95?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fdate%25e5%25af%25b9%25e8%25b1%25a1%25e6%25a0%25bc%25e5%25bc%258f%25e5%258c%2596%25e6%2596%25b9%25e6%25b3%2595%2F&title=Date%E5%AF%B9%E8%B1%A1%E6%A0%BC%E5%BC%8F%E5%8C%96%E6%96%B9%E6%B3%95&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fdate%25e5%25af%25b9%25e8%25b1%25a1%25e6%25a0%25bc%25e5%25bc%258f%25e5%258c%2596%25e6%2596%25b9%25e6%25b3%2595%2F&amp;title=Date%E5%AF%B9%E8%B1%A1%E6%A0%BC%E5%BC%8F%E5%8C%96%E6%96%B9%E6%B3%95?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=Date%E5%AF%B9%E8%B1%A1%E6%A0%BC%E5%BC%8F%E5%8C%96%E6%96%B9%E6%B3%95&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2Fdate%25e5%25af%25b9%25e8%25b1%25a1%25e6%25a0%25bc%25e5%25bc%258f%25e5%258c%2596%25e6%2596%25b9%25e6%25b3%2595%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/date%e5%af%b9%e8%b1%a1%e6%a0%bc%e5%bc%8f%e5%8c%96%e6%96%b9%e6%b3%95/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>战士和苍蝇（纪念钱学森、贝时璋）</title>
		<link>http://www.zhangjingwei.com/archives/%e6%88%98%e5%a3%ab%e5%92%8c%e8%8b%8d%e8%9d%87%ef%bc%88%e7%ba%aa%e5%bf%b5%e9%92%b1%e5%ad%a6%e6%a3%ae%e3%80%81%e8%b4%9d%e6%97%b6%e7%92%8b%ef%bc%89/</link>
		<comments>http://www.zhangjingwei.com/archives/%e6%88%98%e5%a3%ab%e5%92%8c%e8%8b%8d%e8%9d%87%ef%bc%88%e7%ba%aa%e5%bf%b5%e9%92%b1%e5%ad%a6%e6%a3%ae%e3%80%81%e8%b4%9d%e6%97%b6%e7%92%8b%ef%bc%89/#comments</comments>
		<pubDate>Mon, 02 Nov 2009 03:09:24 +0000</pubDate>
		<dc:creator>张经纬</dc:creator>
				<category><![CDATA[北京2009]]></category>
		<category><![CDATA[战士]]></category>
		<category><![CDATA[苍蝇]]></category>

		<guid isPermaLink="false">http://www.zhangjingwei.com/?p=1245</guid>
		<description><![CDATA[=========================================================================== Ｓｃｈｏｐｅｎｈａｕｅｒ〔２〕说过这样的话：要估定人的伟大，则精神上的大和体格上的大，那法则完全相反。后者距离愈远即愈小，前者却见得愈大。 正因为近则愈小，而且愈看见缺点和创伤，所以他就和我们一样，不是神道，不是妖怪，不是异兽。他仍然是人，不过如此。但也惟其如此，所以他是伟大的人。 战士战死了的时候，苍蝇们所首先发见的是他的缺点和伤痕〔3〕，嘬着，营营地叫着，以为得意，以为比死了的战士更英雄。但是战士已经战死了，不再来挥去他们。于是乎苍蝇们即更其营营地叫，自以为倒是不朽的声音，因为它们的完全，远在战士之上。 的确的，谁也没有发见过苍蝇们的缺点和创伤。 然而，有缺点的战士终竟是战士，完美的苍蝇也终竟不过是苍蝇。 去罢，苍蝇们！虽然生着翅子，还能营营，总不会超过战士的。你们这些虫豸们！ 三月二十一日。 AA 〔１〕本篇最初发表于一九二五年三月二十四日北京《京报》附刊《民众文艺周刊》第十四号。 作者在同年四月三日《京报副刊》发表的《这是这么一个意思》中对本文曾有说明：“所谓战士者，是指中山先生和民国元年前后殉国而反受奴才们讥笑糟蹋的先烈；苍蝇则当然是指奴才们。”（见《集外集拾遗》） 〔２〕Ｓｃｈｏｐｅｎｈａｕｅｒ叔本华（１７８８—１８６０），德国哲学家，唯意志论者。这里引述的话，见他的《比喻·隐喻和寓言》一文。 =========================================================================== 我补的： 〔3〕钱老上书亩产万斤，钱老与贝老联合上书推荐气功的相关论文。 能说什么呢？只好如阿Q或者疯子一样再读一遍战士和苍蝇吧。以此文来纪念两位先生并笑看这和谐的社会。 加入书签:]]></description>
			<content:encoded><![CDATA[<p>===========================================================================<br />
Ｓｃｈｏｐｅｎｈａｕｅｒ〔２〕说过这样的话：要估定人的伟大，则精神上的大和体格上的大，那法则完全相反。后者距离愈远即愈小，前者却见得愈大。</p>
<p>正因为近则愈小，而且愈看见缺点和创伤，所以他就和我们一样，不是神道，不是妖怪，不是异兽。他仍然是人，不过如此。但也惟其如此，所以他是伟大的人。</p>
<p>战士战死了的时候，苍蝇们所首先发见的是他的缺点和伤痕〔3〕，嘬着，营营地叫着，以为得意，以为比死了的战士更英雄。但是战士已经战死了，不再来挥去他们。于是乎苍蝇们即更其营营地叫，自以为倒是不朽的声音，因为它们的完全，远在战士之上。</p>
<p>的确的，谁也没有发见过苍蝇们的缺点和创伤。</p>
<p>然而，有缺点的战士终竟是战士，完美的苍蝇也终竟不过是苍蝇。</p>
<p>去罢，苍蝇们！虽然生着翅子，还能营营，总不会超过战士的。你们这些虫豸们！</p>
<p>三月二十一日。</p>
<p>AA<br />
〔１〕本篇最初发表于一九二五年三月二十四日北京《京报》附刊《民众文艺周刊》第十四号。<br />
作者在同年四月三日《京报副刊》发表的《这是这么一个意思》中对本文曾有说明：“所谓战士者，是指中山先生和民国元年前后殉国而反受奴才们讥笑糟蹋的先烈；苍蝇则当然是指奴才们。”（见《集外集拾遗》）<br />
〔２〕Ｓｃｈｏｐｅｎｈａｕｅｒ叔本华（１７８８—１８６０），德国哲学家，唯意志论者。这里引述的话，见他的《比喻·隐喻和寓言》一文。<br />
===========================================================================</p>
<p>我补的：</p>
<p>〔3〕<span>钱老上书亩产万斤，钱老与贝老联合上书推荐气功的相关论文。</span></p>
<p>能说什么呢？只好如阿Q或者疯子一样再读一遍战士和苍蝇吧。以此文来纪念两位先生并笑看这和谐的社会。</p>



加入书签:


	<a rel="nofollow" class="thickbox" href="http://shuqian.qq.com/post?jumpback=1&title=%E6%88%98%E5%A3%AB%E5%92%8C%E8%8B%8D%E8%9D%87%EF%BC%88%E7%BA%AA%E5%BF%B5%E9%92%B1%E5%AD%A6%E6%A3%AE%E3%80%81%E8%B4%9D%E6%97%B6%E7%92%8B%EF%BC%89&uri=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e6%2588%2598%25e5%25a3%25ab%25e5%2592%258c%25e8%258b%258d%25e8%259d%2587%25ef%25bc%2588%25e7%25ba%25aa%25e5%25bf%25b5%25e9%2592%25b1%25e5%25ad%25a6%25e6%25a3%25ae%25e3%2580%2581%25e8%25b4%259d%25e6%2597%25b6%25e7%2592%258b%25ef%25bc%2589%2F?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/qq.png" title="QQ书签" alt="QQ书签" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e6%2588%2598%25e5%25a3%25ab%25e5%2592%258c%25e8%258b%258d%25e8%259d%2587%25ef%25bc%2588%25e7%25ba%25aa%25e5%25bf%25b5%25e9%2592%25b1%25e5%25ad%25a6%25e6%25a3%25ae%25e3%2580%2581%25e8%25b4%259d%25e6%2597%25b6%25e7%2592%258b%25ef%25bc%2589%2F&title=%E6%88%98%E5%A3%AB%E5%92%8C%E8%8B%8D%E8%9D%87%EF%BC%88%E7%BA%AA%E5%BF%B5%E9%92%B1%E5%AD%A6%E6%A3%AE%E3%80%81%E8%B4%9D%E6%97%B6%E7%92%8B%EF%BC%89?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban.png" title="豆瓣" alt="豆瓣" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.douban.com/recommend/?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e6%2588%2598%25e5%25a3%25ab%25e5%2592%258c%25e8%258b%258d%25e8%259d%2587%25ef%25bc%2588%25e7%25ba%25aa%25e5%25bf%25b5%25e9%2592%25b1%25e5%25ad%25a6%25e6%25a3%25ae%25e3%2580%2581%25e8%25b4%259d%25e6%2597%25b6%25e7%2592%258b%25ef%25bc%2589%2F&title=%E6%88%98%E5%A3%AB%E5%92%8C%E8%8B%8D%E8%9D%87%EF%BC%88%E7%BA%AA%E5%BF%B5%E9%92%B1%E5%AD%A6%E6%A3%AE%E3%80%81%E8%B4%9D%E6%97%B6%E7%92%8B%EF%BC%89&n=1?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/douban9.png" title="豆瓣九点" alt="豆瓣九点" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.haohaoreport.com/submit.php?url=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e6%2588%2598%25e5%25a3%25ab%25e5%2592%258c%25e8%258b%258d%25e8%259d%2587%25ef%25bc%2588%25e7%25ba%25aa%25e5%25bf%25b5%25e9%2592%25b1%25e5%25ad%25a6%25e6%25a3%25ae%25e3%2580%2581%25e8%25b4%259d%25e6%2597%25b6%25e7%2592%258b%25ef%25bc%2589%2F&amp;title=%E6%88%98%E5%A3%AB%E5%92%8C%E8%8B%8D%E8%9D%87%EF%BC%88%E7%BA%AA%E5%BF%B5%E9%92%B1%E5%AD%A6%E6%A3%AE%E3%80%81%E8%B4%9D%E6%97%B6%E7%92%8B%EF%BC%89?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/haohao.png" title="Haohao" alt="Haohao" class="sociable-hovers" /></a>
	<a rel="nofollow" class="thickbox" href="http://www.zhangjingwei.com/feed/?TB_iframe=true&amp;height=500&amp;width=900"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/rss.png" title="RSS" alt="RSS" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=%E6%88%98%E5%A3%AB%E5%92%8C%E8%8B%8D%E8%9D%87%EF%BC%88%E7%BA%AA%E5%BF%B5%E9%92%B1%E5%AD%A6%E6%A3%AE%E3%80%81%E8%B4%9D%E6%97%B6%E7%92%8B%EF%BC%89&amp;body=http%3A%2F%2Fwww.zhangjingwei.com%2Farchives%2F%25e6%2588%2598%25e5%25a3%25ab%25e5%2592%258c%25e8%258b%258d%25e8%259d%2587%25ef%25bc%2588%25e7%25ba%25aa%25e5%25bf%25b5%25e9%2592%25b1%25e5%25ad%25a6%25e6%25a3%25ae%25e3%2580%2581%25e8%25b4%259d%25e6%2597%25b6%25e7%2592%258b%25ef%25bc%2589%2F" title="email"><img src="http://www.zhangjingwei.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.zhangjingwei.com/archives/%e6%88%98%e5%a3%ab%e5%92%8c%e8%8b%8d%e8%9d%87%ef%bc%88%e7%ba%aa%e5%bf%b5%e9%92%b1%e5%ad%a6%e6%a3%ae%e3%80%81%e8%b4%9d%e6%97%b6%e7%92%8b%ef%bc%89/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>
