<?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>vapour&#039;s blog</title>
	<atom:link href="http://dovapour.info/feed" rel="self" type="application/rss+xml" />
	<link>http://dovapour.info</link>
	<description></description>
	<lastBuildDate>Tue, 20 Sep 2011 10:44:48 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1</generator>
		<item>
		<title>非字母数字的JS(二)</title>
		<link>http://dovapour.info/archives/326</link>
		<comments>http://dovapour.info/archives/326#comments</comments>
		<pubDate>Tue, 20 Sep 2011 10:44:48 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[non-alphanumeric]]></category>

		<guid isPermaLink="false">http://dovapour.info/?p=326</guid>
		<description><![CDATA[在2011年的BlackHat DC 2011大会上Ryan Barnett给出了一段关于XSS的示例javascript代码：&#160; ($=[$=[]][(__=!$+$)[_=-~-~-~$]+({}+$)[_/_]+($$=($_=!&#39;&#39;+$)[_/_]+$_[+$])])()[__[_/_]+__[_+~$]+$_[_]+$$](_/_) 上面这段代码在浏览器中输出alert(1)，这段代码中巧妙利用sort函数执行返回window对象来获取window对象，然后执行window[&#39;alert&#39;](1)。关于这段代码的详细解释可查看这里。 关于上面代码的实现技术原理，可以查看《非字母数字组成的JavaScript》。 由上面的代码，引发思考能不能输出数字(0-9)和全部26个字母，于是进行了下面尝试： //获取数字 console.log(+[]); //0 console.log(-~[]); //1 console.log(-~-~[]); //2 console.log(-~-~-~[]); //3 console.log(-~-~-~-~[]); //4 console.log(-~-~-~-~-~[]); //5 console.log(-~-~-~-~-~-~[]); //6 console.log(-~-~-~-~-~-~-~[]); //7 console.log(-~-~-~-~-~-~-~-~[]); //8 console.log(-~-~-~-~-~-~-~-~-~[]); //9 通过上面这种方法，可以得到0-9，再组合0-9就可以得到任意数值了。 //获取字母 //[{}]+[] [object Object] console.log(([{}]+[])[-~[]]); //o console.log(([{}]+[])[-~-~[]]); //b console.log(([{}]+[])[-~-~-~[]]); //j console.log(([{}]+[])[-~-~-~-~[]]); //e console.log(([{}]+[])[-~-~-~-~-~[]]); //c console.log(([{}]+[])[-~-~-~-~-~-~[]]); //t //![]+[] false console.log((![] + [])[+[]]); //f console.log((![] + [])[-~[]]); [...]]]></description>
			<content:encoded><![CDATA[<p>
	在2011年的BlackHat DC 2011大会上Ryan Barnett给出了一段关于XSS的示例javascript代码：&nbsp;</p>
<div class="code">
	<span class="js-reserved">(</span>$=<span class="js-reserved">[</span>$=<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">[</span><span class="js-reserved">(</span>__=!$+$<span class="js-reserved">)</span><span class="js-reserved">[</span>_=-~-~-~$<span class="js-reserved">]</span>+<span class="js-reserved">(</span><span class="js-reserved">{</span><span class="js-reserved">}</span>+$<span class="js-reserved">)</span><span class="js-reserved">[</span>_/_]+($$=($_=!&#39;&#39;+$)[_/_<span class="js-reserved">]</span>+$_<span class="js-reserved">[</span>+$<span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">(</span><span class="js-reserved">)</span><span class="js-reserved">[</span>__<span class="js-reserved">[</span>_/_]+__[_+~$]+$_[_]+$$](_/_<span class="js-reserved">)</span></div>
<p>
	上面这段代码在浏览器中输出alert(1)，这段代码中巧妙利用sort函数执行返回window对象来获取window对象，然后执行window[&#39;alert&#39;](1)。关于这段代码的详细解释可查看<a href="http://www.iteye.com/topic/947149">这里</a>。</p>
<p>
	关于上面代码的实现技术原理，可以查看《<a href="http://dovapour.info/archives/283">非字母数字组成的JavaScript</a>》。</p>
<p>
	由上面的代码，引发思考能不能输出数字(0-9)和全部26个字母，于是进行了下面尝试：</p>
<div class="code">
	<span class="js-comment">//获取数字</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//0</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//1</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//2</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//3</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//4</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>-~-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//5</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>-~-~-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//6</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>-~-~-~-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//7</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>-~-~-~-~-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//8 </span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>-~-~-~-~-~-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//9</span></div>
<p>
	通过上面这种方法，可以得到0-9，再组合0-9就可以得到任意数值了。</p>
<div class="code">
	<span class="js-comment">//获取字母</span><br />
	<span class="js-comment">//[{}]+[] [object Object]</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">[</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//o</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">[</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//b</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">[</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//j</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">[</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//e</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">[</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//c</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">[</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//t</span></p>
<p>	<span class="js-comment">//![]+[] false</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span>!<span class="js-reserved">[</span><span class="js-reserved">]</span> + <span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//f</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span>!<span class="js-reserved">[</span><span class="js-reserved">]</span> + <span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//a</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span>!<span class="js-reserved">[</span><span class="js-reserved">]</span> + <span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//l</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span>!<span class="js-reserved">[</span><span class="js-reserved">]</span> + <span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//s</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span>!<span class="js-reserved">[</span><span class="js-reserved">]</span> + <span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//e</span></p>
<p>	<span class="js-comment">//!![]+[] true</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span>!!<span class="js-reserved">[</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//t</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span>!!<span class="js-reserved">[</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//r</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span>!!<span class="js-reserved">[</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//u</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span>!!<span class="js-reserved">[</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//e</span></p>
<p>	<span class="js-comment">//({}[(!![]+[])[+[]]])+[] undefined</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">[</span><span class="js-reserved">(</span>!!<span class="js-reserved">[</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//n</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">[</span><span class="js-reserved">(</span>!!<span class="js-reserved">[</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//d</span><br />
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">(</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">[</span><span class="js-reserved">(</span>!!<span class="js-reserved">[</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-reserved">[</span>-~-~-~-~-~<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span>; <span class="js-comment">//i</span></div>
<p>
	经过尝试，暂时只能得到a b c d e f i j l n o r s t u共15个字母。欢迎补充</p>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/326/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>轻量级模板系统</title>
		<link>http://dovapour.info/archives/320</link>
		<comments>http://dovapour.info/archives/320#comments</comments>
		<pubDate>Wed, 10 Aug 2011 12:03:40 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[template]]></category>

		<guid isPermaLink="false">http://dovapour.info/?p=320</guid>
		<description><![CDATA[开发问卷系统时，开发了一个简单的模板管理功能。实现了简单的变量替换、循环、自定义函数、并提供了循环变量tmCount(从0开始)和tmNumber(从1开始)。不多说，先上代码： var templateManager = (function () { &#160;&#160;&#160;&#160;var templates = {}, &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;tmp, &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;supplant = { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;init: function (str, params) { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var value, prop, tmp, len; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;for (prop in params) { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;if (params.hasOwnProperty(prop)) { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;value = params[prop]; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;switch (Object.prototype.toString.call(value)) { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;case &#39;[object Number]&#39;: &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;case &#39;[object String]&#39;: &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;tmp = {}; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;tmp[prop] = value; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;str = supplant.replaceString(str, tmp); [...]]]></description>
			<content:encoded><![CDATA[<p>
	开发问卷系统时，开发了一个简单的模板管理功能。实现了简单的变量替换、循环、自定义函数、并提供了循环变量tmCount(从0开始)和tmNumber(从1开始)。不多说，先上代码：</p>
<div class="code">
	<span class="js-reserved">var</span> templateManager = <span class="js-reserved">(</span><span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> templates = <span class="js-reserved">{</span><span class="js-reserved">}</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tmp,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;supplant = <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;init: <span class="js-reserved">function</span> <span class="js-reserved">(</span>str, params<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> value, prop, tmp, len;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">for</span> <span class="js-reserved">(</span>prop <span class="js-reserved">in</span> params<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span>params.hasOwnProperty<span class="js-reserved">(</span>prop<span class="js-reserved">)</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;value = params<span class="js-reserved">[</span>prop<span class="js-reserved">]</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">switch</span> <span class="js-reserved">(</span><span class="js-native">Object</span>.prototype.<span class="js-native">toString</span>.call<span class="js-reserved">(</span>value<span class="js-reserved">)</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">case</span> <span class="js-string">&#39;[object Number]&#39;</span>:<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">case</span> <span class="js-string">&#39;[object String]&#39;</span>:<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tmp = <span class="js-reserved">{</span><span class="js-reserved">}</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tmp<span class="js-reserved">[</span>prop<span class="js-reserved">]</span> = value;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;str = supplant.replaceString<span class="js-reserved">(</span>str, tmp<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">break</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">case</span> <span class="js-string">&#39;[object Function]&#39;</span>:<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;str = supplant.replaceFunc<span class="js-reserved">(</span>str, prop, value, params<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">break</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">case</span> <span class="js-string">&#39;[object Array]&#39;</span>:<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;str = supplant.replaceArray<span class="js-reserved">(</span>str, prop, value<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">break</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">default</span>:<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">break</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> str;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;replaceString: <span class="js-reserved">function</span> <span class="js-reserved">(</span>str, params<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> prop;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">for</span> <span class="js-reserved">(</span>prop <span class="js-reserved">in</span> params<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span>params.hasOwnProperty<span class="js-reserved">(</span>prop<span class="js-reserved">)</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;str = str.<span class="js-native">split</span><span class="js-reserved">(</span><span class="js-string">&#39;{&#39;</span> + prop + <span class="js-string">&#39;}&#39;</span><span class="js-reserved">)</span>.<span class="js-native">join</span><span class="js-reserved">(</span>params<span class="js-reserved">[</span>prop<span class="js-reserved">]</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> str;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;replaceFunc: <span class="js-reserved">function</span> <span class="js-reserved">(</span>str, prop, func, <span class="js-reserved">item</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> str.<span class="js-native">split</span><span class="js-reserved">(</span><span class="js-string">&#39;{&#39;</span> + prop + <span class="js-string">&#39;}&#39;</span><span class="js-reserved">)</span>.<span class="js-native">join</span><span class="js-reserved">(</span>func<span class="js-reserved">(</span><span class="js-reserved">item</span><span class="js-reserved">)</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;replaceArray: <span class="js-reserved">function</span> <span class="js-reserved">(</span>str, prop, data<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> i = <span class="js-number">0</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;left,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;middle,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;right,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;s = <span class="js-string">&#39;{#&#39;</span> + prop + <span class="js-string">&#39;}&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;e = <span class="js-string">&#39;{/&#39;</span> + prop + <span class="js-string">&#39;}&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;len = data.length,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;start = <span class="js-number">0</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;end = <span class="js-number">0</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;start = str.<span class="js-native">indexOf</span><span class="js-reserved">(</span>s<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;end = str.<span class="js-native">indexOf</span><span class="js-reserved">(</span>e, start<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;left = str.<span class="js-native">slice</span><span class="js-reserved">(</span><span class="js-number">0</span>, start<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;middle = str.<span class="js-native">slice</span><span class="js-reserved">(</span>start + s.length, end<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;right = str.<span class="js-native">slice</span><span class="js-reserved">(</span>end + e.length<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span>len &gt; <span class="js-number">0</span> &amp;&amp; start &gt; -<span class="js-number">1</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">for</span> <span class="js-reserved">(</span>; i &lt; len; ++i<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;data<span class="js-reserved">[</span>i<span class="js-reserved">]</span>.tmCount = i;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;data<span class="js-reserved">[</span>i<span class="js-reserved">]</span>.tmNumber = i + <span class="js-number">1</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span>data<span class="js-reserved">[</span>i<span class="js-reserved">]</span>.content !== <span class="js-reserved">null</span><span class="js-reserved">)</span> <span class="js-reserved">{</span> <span class="js-comment">//如果content属性不等于null</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;left += supplant.init<span class="js-reserved">(</span>middle, data<span class="js-reserved">[</span>i<span class="js-reserved">]</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span> <span class="js-reserved">else</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;left += data<span class="js-reserved">[</span>i<span class="js-reserved">]</span>.<span class="js-native">replace</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;str = left + right;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span>str.<span class="js-native">indexOf</span><span class="js-reserved">(</span>s<span class="js-reserved">)</span> &gt; -<span class="js-number">1</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><span class="js-comment">//如果包括多个循环</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;str = supplant.replaceArray<span class="js-reserved">(</span>str, prop, data<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span>len == <span class="js-number">0</span> &amp;&amp; start &gt; -<span class="js-number">1</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;str = left + right;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> str;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;render: <span class="js-reserved">function</span> <span class="js-reserved">(</span>name, params<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span><span class="js-native">typeof</span> templates<span class="js-reserved">[</span>name<span class="js-reserved">]</span> !== <span class="js-string">&#39;string&#39;</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">throw</span> <span class="js-string">&#39;Template &#39;</span> + name + <span class="js-string">&#39; not found!&#39;</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tmp = name;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> supplant.init<span class="js-reserved">(</span>templates<span class="js-reserved">[</span>name<span class="js-reserved">]</span>, params<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;defineTemplate: <span class="js-reserved">function</span> <span class="js-reserved">(</span>name, template<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span><span class="js-native">typeof</span> template == <span class="js-string">&#39;string&#39;</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;templates<span class="js-reserved">[</span>name<span class="js-reserved">]</span> = template;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span> <span class="js-reserved">else</span> <span class="js-reserved">{</span> <span class="js-comment">//数组</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;templates<span class="js-reserved">[</span>name<span class="js-reserved">]</span> = template.<span class="js-native">join</span><span class="js-reserved">(</span>&#39;&#39;<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>;<br />
	<span class="js-reserved">}</span><span class="js-reserved">)</span><span class="js-reserved">(</span><span class="js-reserved">)</span>;</div>
<p>
	上面代码中定义一个templateManager对象用来管理模板，提供了两个接口：</p>
<ol>
<li>
		defineTemplate 用来定义模板</li>
<li>
		render 用来渲染模板</li>
</ol>
<p>
	内部私有的supplant对象实现模板引擎，提供了替换变量、替换循环、替换函数的功能。</p>
<p>
	文档和示例：</p>
<div class="code">
	<span class="js-comment">//替换变量</span><br />
	templateManager.defineTemplate<span class="js-reserved">(</span><span class="js-string">&#39;profile&#39;</span>, <span class="js-string">&#39;姓名:{name}，blog:{blog}&#39;</span><span class="js-reserved">)</span>;<br />
	templateManager.render<span class="js-reserved">(</span><span class="js-string">&#39;profile&#39;</span>, <span class="js-reserved">{</span>name: <span class="js-string">&#39;vapour&#39;</span>, blog: &#39;http://dovapour.info/&#39;});<br />
	<span class="js-comment">//结果 姓名:vapour，blog:http://dovapour.info/</span></p>
<p>	<span class="js-comment">//实现循环</span><br />
	templateManager.defineTemplate<span class="js-reserved">(</span><span class="js-string">&#39;website&#39;</span>, <span class="js-reserved">[</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-string">&#39;&lt;ul&gt;&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-string">&#39;{#webs}&lt;li&gt;&lt;a href=&quot;{url}&quot;&gt;{name}&lt;_buff_29_buff_li&gt;{/webs}&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-string">&#39;&lt;ul&gt;&#39;</span><br />
	<span class="js-reserved">]</span><span class="js-reserved">)</span>;<br />
	templateManager.render<span class="js-reserved">(</span><span class="js-string">&#39;website&#39;</span>, <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;webs: <span class="js-reserved">[</span><span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;name: <span class="js-string">&#39;百度&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url: <span class="js-string">&#39;http://www.baidu.com/&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;getLen: <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">item</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">item</span>.url.length;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>, <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;name: <span class="js-string">&#39;淘宝&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url: <span class="js-string">&#39;http://www.taobao.com/&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;getLen: <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">item</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">item</span>.url.length;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>, <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;name: <span class="js-string">&#39;腾讯&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url: <span class="js-string">&#39;http://www.qq.com/&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;getLen: <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">item</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">item</span>.url.length;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>, <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;name: <span class="js-string">&#39;网易&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url: <span class="js-string">&#39;http://163.com/&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;getLen: <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">item</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">item</span>.url.length;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>, <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;name: <span class="js-string">&#39;新浪&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url: <span class="js-string">&#39;http://www.sina.com/&#39;</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;getLen: <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">item</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">item</span>.url.length;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><span class="js-reserved">]</span><br />
	<span class="js-reserved">}</span><span class="js-reserved">)</span>;<br />
	<span class="js-comment">/*<br />
	&lt;ul&gt;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&lt;li&gt;&lt;a href=&quot;http://www.baidu.com/&quot;&gt;百度&lt;/a&gt;，url长度21&lt;/li&gt;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&lt;li&gt;&lt;a href=&quot;http://www.taobao.com/&quot;&gt;淘宝&lt;/a&gt;，url长度22&lt;/li&gt;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&lt;li&gt;&lt;a href=&quot;http://www.qq.com/&quot;&gt;腾讯&lt;/a&gt;，url长度18&lt;/li&gt;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&lt;li&gt;&lt;a href=&quot;http://163.com/&quot;&gt;网易&lt;/a&gt;，url长度15&lt;/li&gt;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&lt;li&gt;&lt;a href=&quot;http://www.sina.com/&quot;&gt;新浪&lt;/a&gt;，url长度20&lt;/li&gt;<br />
	&lt;ul&gt;<br />
	*/</span></div>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/320/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ie中的跨域和ckeditor</title>
		<link>http://dovapour.info/archives/318</link>
		<comments>http://dovapour.info/archives/318#comments</comments>
		<pubDate>Fri, 22 Jul 2011 02:28:27 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[ckeditor]]></category>
		<category><![CDATA[cross-domain]]></category>

		<guid isPermaLink="false">http://dovapour.info/?p=318</guid>
		<description><![CDATA[在IE中修改了document.domain进行提权后(无论修改前后域名是否不同)，iframe都会出现跨域问题。 ckeditor中检查跨域的代码，是根据判断document.domain和window.location.hostname是否相同来来判断跨域的。 isCustomDomain: function () { &#160;&#160;&#160;if (!this.ie) return false; &#160;&#160;&#160;var g = document.domain, &#160;&#160;&#160;h = window.location.hostname; &#160;&#160;&#160;return g != h &#38;&#38; g != &#39;[&#39; + h + &#39;]&#39;; } 当我们执行在页面执行 document.domain = document.domain 后，执行 isCustomDomain 会返回false，这时ie会因为跨域，报拒绝访问的错误。 所以当我们，在修改document.domain时要进行判断，当新域和旧域不同时再修改document.domain var oldDomain = document.domain, &#160;&#160;&#160;&#160;newDomain = &#39;xxx.com&#39;; if (newDomain != oldDomain) { &#160;&#160;&#160;document.domain = newDomain; } &#160;]]></description>
			<content:encoded><![CDATA[<p>
	<span style="border-collapse: collapse; font-size: 13px;">在IE中修改了document.domain进行提权后(无论修改前后域名是否不同)，iframe都会出现跨域问题。</span></p>
<p>
	ckeditor中检查跨域的代码，是根据判断document.domain和window.location.hostname是否相同来来判断跨域的。</p>
<div class="code">
	isCustomDomain: <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span>!<span class="js-reserved">this</span>.ie<span class="js-reserved">)</span> <span class="js-reserved">return</span> <span class="js-reserved">false</span>;<br />
	&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> g = <span class="js-client">document</span>.domain,<br />
	&nbsp;&nbsp;&nbsp;h = <span class="js-client">window</span>.location.hostname;<br />
	&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> g != h &amp;&amp; g != <span class="js-string">&#39;[&#39;</span> + h + <span class="js-string">&#39;]&#39;</span>;<br />
	<span class="js-reserved">}</span></div>
<p>
	当我们执行在页面执行 document.domain = document.domain 后，执行 isCustomDomain 会返回false，这时ie会因为跨域，报拒绝访问的错误。</p>
<p>
	所以当我们，在修改document.domain时要进行判断，当新域和旧域不同时再修改document.domain</p>
<div class="code">
	<span class="js-reserved">var</span> oldDomain = <span class="js-client">document</span>.domain,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;newDomain = <span class="js-string">&#39;xxx.com&#39;</span>;<br />
	<span class="js-reserved">if</span> <span class="js-reserved">(</span>newDomain != oldDomain<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;<span class="js-client">document</span>.domain = newDomain;<br />
	<span class="js-reserved">}</span></div>
<p>
	&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/318/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>跨浏览器实现全选功能</title>
		<link>http://dovapour.info/archives/313</link>
		<comments>http://dovapour.info/archives/313#comments</comments>
		<pubDate>Thu, 07 Jul 2011 09:38:57 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[range]]></category>
		<category><![CDATA[selection]]></category>

		<guid isPermaLink="false">http://dovapour.info/?p=313</guid>
		<description><![CDATA[跨浏览器实现全选功能，IE一行代码就OK，标准浏览器就比较麻烦了，需要使用selection、range、addRange实现。 var selectAll = (function () { &#160;&#160;&#160;if (arale.isIE()) { //IE &#160;&#160;&#160;&#160;&#160;&#160;return function (win) { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;win = win &#124;&#124; window; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;win.document.body.createControlRange().execCommand(&#39;SelectAll&#39;); &#160;&#160;&#160;&#160;&#160;&#160;} &#160;&#160;&#160;} else { //标准浏览器 &#160;&#160;&#160;&#160;&#160;&#160;return function (win) { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;var s, r; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;win = win &#124;&#124; window; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;doc = win.document; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;s = win.getSelection(); &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;r = doc.createRange(); &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;r.selectNode(doc.body); &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;s.addRange(r); &#160;&#160;&#160;&#160;&#160;&#160;} &#160;&#160;&#160;} })();]]></description>
			<content:encoded><![CDATA[<p>
	跨浏览器实现全选功能，IE一行代码就OK，标准浏览器就比较麻烦了，需要使用selection、range、addRange实现。</p>
<div class="code">
	<span class="js-reserved">var</span> selectAll = <span class="js-reserved">(</span><span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span>arale.isIE<span class="js-reserved">(</span><span class="js-reserved">)</span><span class="js-reserved">)</span> <span class="js-reserved">{</span> <span class="js-comment">//IE</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">function</span> <span class="js-reserved">(</span>win<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;win = win || <span class="js-client">window</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;win.<span class="js-client">document</span>.<span class="js-client">body</span>.createControlRange<span class="js-reserved">(</span><span class="js-reserved">)</span>.execCommand<span class="js-reserved">(</span><span class="js-string">&#39;SelectAll&#39;</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span> <span class="js-reserved">else</span> <span class="js-reserved">{</span> <span class="js-comment">//标准浏览器</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">function</span> <span class="js-reserved">(</span>win<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> s, r;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;win = win || <span class="js-client">window</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;doc = win.<span class="js-client">document</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;s = win.<span class="js-native">getSelection</span><span class="js-reserved">(</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;r = doc.createRange<span class="js-reserved">(</span><span class="js-reserved">)</span>;</p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;r.selectNode<span class="js-reserved">(</span>doc.<span class="js-client">body</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;s.addRange<span class="js-reserved">(</span>r<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	<span class="js-reserved">}</span><span class="js-reserved">)</span><span class="js-reserved">(</span><span class="js-reserved">)</span>;</div>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/313/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>使用动态类型、对象构造而非继承</title>
		<link>http://dovapour.info/archives/202</link>
		<comments>http://dovapour.info/archives/202#comments</comments>
		<pubDate>Tue, 19 Apr 2011 08:50:07 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[duck typing]]></category>

		<guid isPermaLink="false">http://www.dovapour.info/?p=202</guid>
		<description><![CDATA[今天读了OOP The Good Parts: Message Passing, Duck Typing, Object Composition, and not Inheritance，作者提倡使用动态类型(duck typing)、对象构造来代替继承。 关于动态类型的示例代码： function bad (foo) { &#160;&#160;&#160;&#160;if ( ! (foo instanceof Bar) ) { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;throw new TypeError(&#34;This is an annoying restriction!&#34;); &#160;&#160;&#160;&#160;} &#160;&#160;&#160;&#160;return foo.baz(foo.quux(10)); } function good (foo) { &#160;&#160;&#160;&#160;if ( !foo.baz &#124;&#124; !foo.quux ) { &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;throw new TypeError(&#34;We need foo to [...]]]></description>
			<content:encoded><![CDATA[<p>
	今天读了<a href="http://fitzgeraldnick.com/weblog/39/">OOP The Good Parts: Message Passing, Duck Typing, Object Composition, and not Inheritance</a>，作者提倡使用动态类型(<a href="http://en.wikipedia.org/wiki/Duck_typing">duck typing</a>)、对象构造来代替继承。</p>
<p>
	关于动态类型的示例代码：</p>
<div class="code">
	<span class="js-reserved">function</span> bad <span class="js-reserved">(</span>foo<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span> ! <span class="js-reserved">(</span>foo instanceof Bar<span class="js-reserved">)</span> <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">throw</span> <span class="js-reserved">new</span> TypeError<span class="js-reserved">(</span><span class="js-string">&quot;This is an annoying restriction!&quot;</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> foo.baz<span class="js-reserved">(</span>foo.quux<span class="js-reserved">(</span><span class="js-number">10</span><span class="js-reserved">)</span><span class="js-reserved">)</span>;<br />
	<span class="js-reserved">}</span></p>
<p>	<span class="js-reserved">function</span> good <span class="js-reserved">(</span>foo<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span> !foo.baz || !foo.quux <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">throw</span> <span class="js-reserved">new</span> TypeError<span class="js-reserved">(</span><span class="js-string">&quot;We need foo to have baz and quux methods.&quot;</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> foo.baz<span class="js-reserved">(</span>foo.quux<span class="js-reserved">(</span><span class="js-number">10</span><span class="js-reserved">)</span><span class="js-reserved">)</span>;<br />
	<span class="js-reserved">}</span></div>
<p>
	下面是作者给出使用动态类型和对象构造的一个操作DOM的示例：</p>
<div class="code">
	<span class="js-reserved">var</span> quacksLike = <span class="js-reserved">function</span> <span class="js-reserved">(</span>obj, definition<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> k, ctor;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">for</span> <span class="js-reserved">(</span> k <span class="js-reserved">in</span> definition <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ctor = definition<span class="js-reserved">[</span>k<span class="js-reserved">]</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span> ctor === <span class="js-native">Number</span> <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span> <span class="js-native">Object</span>.prototype.<span class="js-native">toString</span>.call<span class="js-reserved">(</span>obj<span class="js-reserved">[</span>k<span class="js-reserved">]</span><span class="js-reserved">)</span> !== <span class="js-string">&quot;[object Number]&quot;</span> || <span class="js-native">isNaN</span><span class="js-reserved">(</span>obj<span class="js-reserved">[</span>k<span class="js-reserved">]</span><span class="js-reserved">)</span> <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">false</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span> <span class="js-reserved">else</span> <span class="js-reserved">if</span> <span class="js-reserved">(</span> ctor === <span class="js-native">String</span> <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span> <span class="js-native">Object</span>.prototype.<span class="js-native">toString</span>.call<span class="js-reserved">(</span>obj<span class="js-reserved">[</span>k<span class="js-reserved">]</span><span class="js-reserved">)</span> !== <span class="js-string">&quot;[object String]&quot;</span> <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">false</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span> <span class="js-reserved">else</span> <span class="js-reserved">if</span> <span class="js-reserved">(</span> ! <span class="js-reserved">(</span>obj<span class="js-reserved">[</span>k<span class="js-reserved">]</span> instanceof ctor<span class="js-reserved">)</span> <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">false</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">true</span>;<br />
	<span class="js-reserved">}</span>;<br />
	<span class="js-native">Object</span>.combine = <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> newObj = <span class="js-reserved">{</span><span class="js-reserved">}</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;i = <span class="js-number">0</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;args = <span class="js-native">Array</span>.prototype.<span class="js-native">slice</span>.call<span class="js-reserved">(</span>arguments<span class="js-reserved">)</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;len = args.length;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">function</span> copyProperty<span class="js-reserved">(</span>k<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;newObj<span class="js-reserved">[</span>k<span class="js-reserved">]</span> = args<span class="js-reserved">[</span>i<span class="js-reserved">]</span><span class="js-reserved">[</span>k<span class="js-reserved">]</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">for</span> <span class="js-reserved">(</span> ; i &lt; len; i++ <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-native">Object</span>.getOwnPropertyNames<span class="js-reserved">(</span>args<span class="js-reserved">[</span>i<span class="js-reserved">]</span><span class="js-reserved">)</span>.forEach<span class="js-reserved">(</span>copyProperty<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> newObj;<br />
	<span class="js-reserved">}</span>;<br />
	<span class="js-client">window</span>.$ = <span class="js-reserved">(</span><span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> undef, listen, customAPI;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// Private function to turn &#39;thing&#39; in to an array,</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// optionally slicing the first &#39;n&#39; elems off.</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">function</span> toArray<span class="js-reserved">(</span>thing, n<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-native">Array</span>.prototype.<span class="js-native">slice</span>.call<span class="js-reserved">(</span>thing, n || <span class="js-number">0</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span></p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// Private function to partially apply the first n arguments</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// to &#39;fn&#39;.</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">function</span> curry <span class="js-reserved">(</span>fn<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> args = toArray<span class="js-reserved">(</span>arguments, <span class="js-number">1</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> fn.apply<span class="js-reserved">(</span><span class="js-reserved">this</span>, args.<span class="js-native">concat</span><span class="js-reserved">(</span>toArray<span class="js-reserved">(</span>arguments<span class="js-reserved">)</span><span class="js-reserved">)</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span></p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// Private function to set the attribute &#39;attr&#39; of a single</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// DOM node &#39;node&#39; to &#39;val&#39;.</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">function</span> nodeAttributeSetter <span class="js-reserved">(</span>attr, val, node<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;node.setAttribute<span class="js-reserved">(</span>attr, val<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span></p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// Private function to get the value of the attribute &#39;attr&#39;</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// on the DOM node &#39;node&#39;.</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">function</span> nodeAttributeGetter <span class="js-reserved">(</span>attr, node<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> node.getAttribute<span class="js-reserved">(</span>attr<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span></p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// Do the work to determine the correct method for attaching</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// event listeners only once by using &#39;quacksLike&#39; and an</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// immediately invoked function.</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;listen = <span class="js-reserved">(</span><span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> w3c = <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;addEventListener: <span class="js-native">Function</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ie = <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;attachEvent: <span class="js-native">Function</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>;</p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span> quacksLike<span class="js-reserved">(</span><span class="js-client">document</span>.<span class="js-client">body</span>, w3c<span class="js-reserved">)</span> <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-client">event</span>, fn, node<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;node.addEventListener<span class="js-reserved">(</span><span class="js-client">event</span>, fn, <span class="js-reserved">false</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span> <span class="js-reserved">else</span> <span class="js-reserved">if</span> <span class="js-reserved">(</span> quacksLike<span class="js-reserved">(</span><span class="js-client">document</span>.<span class="js-client">body</span>, ie<span class="js-reserved">)</span> <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-client">event</span>, fn, node<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;node.attachEvent<span class="js-reserved">(</span><span class="js-string">&quot;on&quot;</span> + <span class="js-client">event</span>, fn<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span> <span class="js-reserved">else</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">throw</span> <span class="js-reserved">new</span> TypeError<span class="js-reserved">(</span><span class="js-string">&quot;Do not know how to attach event listeners.&quot;</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><span class="js-reserved">(</span><span class="js-reserved">)</span><span class="js-reserved">)</span>;</p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// This object is a mixin to be composed with the NodeList</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// results of querying the DOM by CSS selector. It provides</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// handy methods for getting and setting attributes,</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// attaching event listeners, and performing sub-queries by</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-comment">// CSS on these elements.</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;customAPI = <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;attr: <span class="js-reserved">function</span> <span class="js-reserved">(</span>attr, val<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">if</span> <span class="js-reserved">(</span> val !== undef <span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">this</span>.forEach<span class="js-reserved">(</span>curry<span class="js-reserved">(</span>nodeAttributeSetter, attr, val<span class="js-reserved">)</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">this</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span> <span class="js-reserved">else</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">this</span>.length &gt; <span class="js-number">0</span> ? nodeAttributeGetter<span class="js-reserved">(</span>attr, <span class="js-reserved">this</span><span class="js-reserved">[</span><span class="js-number">0</span><span class="js-reserved">]</span><span class="js-reserved">)</span> : &quot;&quot;;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>,<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;on: <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-client">event</span>, fn<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">this</span>.forEach<span class="js-reserved">(</span>curry<span class="js-reserved">(</span>listen, <span class="js-client">event</span>, fn<span class="js-reserved">)</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">this</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>,</p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-client">find</span>: <span class="js-reserved">function</span> <span class="js-reserved">(</span>selector<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">var</span> res = <span class="js-reserved">[</span><span class="js-reserved">]</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">this</span>.forEach<span class="js-reserved">(</span><span class="js-reserved">function</span> <span class="js-reserved">(</span>node<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;res.<span class="js-native">push</span>.apply<span class="js-reserved">(</span>res, toArray<span class="js-reserved">(</span>node.querySelectorAll<span class="js-reserved">(</span>selector<span class="js-reserved">)</span><span class="js-reserved">)</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-native">Object</span>.combine<span class="js-reserved">(</span>res, customAPI<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span></p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>;</p>
<p>	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-reserved">function</span> <span class="js-reserved">(</span>selector, context<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;context = context || <span class="js-client">document</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-native">Object</span>.combine<span class="js-reserved">(</span><span class="js-native">Array</span>.prototype, context.querySelectorAll<span class="js-reserved">(</span>selector<span class="js-reserved">)</span>, customAPI<span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">}</span>;</p>
<p>	<span class="js-reserved">}</span><span class="js-reserved">(</span><span class="js-reserved">)</span><span class="js-reserved">)</span>;</p>
<p>	<span class="js-comment">//The mini DOM library might be used like this:</span></p>
<p>	<span class="js-comment">// The following two forms are equivalent.</span><br />
	<span class="js-comment">// They select the same elements.</span><br />
	$<span class="js-reserved">(</span><span class="js-string">&quot;div&quot;</span><span class="js-reserved">)</span>.<span class="js-client">find</span><span class="js-reserved">(</span><span class="js-string">&quot;p&quot;</span><span class="js-reserved">)</span>;<br />
	$<span class="js-reserved">(</span><span class="js-string">&quot;div p&quot;</span><span class="js-reserved">)</span>;</p>
<p>	<span class="js-comment">// Disable all links.</span><br />
	$<span class="js-reserved">(</span><span class="js-string">&quot;a&quot;</span><span class="js-reserved">)</span>.on<span class="js-reserved">(</span><span class="js-string">&quot;click&quot;</span>, <span class="js-reserved">function</span> <span class="js-reserved">(</span><span class="js-client">event</span><span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;<span class="js-client">event</span>.preventDefault<span class="js-reserved">(</span><span class="js-reserved">)</span>;<br />
	&nbsp;&nbsp;<span class="js-client">alert</span><span class="js-reserved">(</span><span class="js-string">&quot;Don&#39;t leave me all alone!&quot;</span><span class="js-reserved">)</span>;<br />
	<span class="js-reserved">}</span><span class="js-reserved">)</span>;</p>
<p>	<span class="js-comment">// Get the id of the first paragraph.</span><br />
	$<span class="js-reserved">(</span><span class="js-string">&quot;p&quot;</span><span class="js-reserved">)</span>.attr<span class="js-reserved">(</span><span class="js-string">&quot;id&quot;</span><span class="js-reserved">)</span>;</p>
<p>	<span class="js-comment">// Disable all input elementss.</span><br />
	$<span class="js-reserved">(</span>input<span class="js-string">&quot;).attr(&quot;</span>disabled<span class="js-string">&quot;, &quot;</span>disabled&quot;<span class="js-reserved">)</span>;</p>
<p>	<span class="js-comment">// Do stuff with each matched element.</span><br />
	$<span class="js-reserved">(</span><span class="js-string">&quot;div.foo&quot;</span><span class="js-reserved">)</span>.forEach<span class="js-reserved">(</span><span class="js-reserved">function</span> <span class="js-reserved">(</span>el<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;doStuffWith<span class="js-reserved">(</span>el<span class="js-reserved">)</span>;<br />
	<span class="js-reserved">}</span><span class="js-reserved">)</span>;</div>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/202/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS3动画实现mouseLeave和mouseEnter的不同效果</title>
		<link>http://dovapour.info/archives/290</link>
		<comments>http://dovapour.info/archives/290#comments</comments>
		<pubDate>Fri, 25 Mar 2011 02:06:54 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[transform]]></category>
		<category><![CDATA[transition]]></category>

		<guid isPermaLink="false">http://dovapour.info/?p=290</guid>
		<description><![CDATA[Eric在Inconsistent Transitions 中指出CSS3动画在浏览器中的不一致。 div:hover span { &#160;&#160;&#160;&#160;transition: 1s transform; &#160;&#160;&#160;&#160;transform: rotate(270deg); } 上面代码只在鼠标移动到div上时有过渡动画(transition)，在鼠标离开div时没有过渡动画。并给出如下解决文案： div span { &#160;&#160;&#160;&#160;transition: 1s transform; } div:hover span { &#160;&#160;&#160;&#160;transform: rotate(270deg); } 这样，当鼠标进入和离开div时，都有过渡动画效果。其实我们可以进一步实现鼠标进入（mouseEnter）和鼠标离开（mouseLeave）的不同效果。 /*mouseleave*/ div span { &#160;&#160;&#160;&#160;transition: 3s transform; } /*mouseenter*/ div:hover span { &#160;&#160;&#160;&#160;transform: rotate(270deg); &#160;&#160;&#160;&#160;transition: 1s transform; } 这样，就实现了mouseLeave和mouseEnter的不同过渡效果。]]></description>
			<content:encoded><![CDATA[<p>
	Eric在<a href="http://meyerweb.com/eric/thoughts/2011/03/24/inconsistent-transitions/">Inconsistent Transitions</a> 中指出CSS3动画在浏览器中的不一致。</p>
<div class="code">
	<span class="css-selector">div:hover span {</span><br />
	<span class="css-name">&nbsp;&nbsp;&nbsp;&nbsp;transition:<span class="css-value"> 1s transform</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;transform:<span class="css-value"> rotate(270deg)</span>;</span><br />
	}</div>
<p>
	上面代码只在鼠标移动到div上时有过渡动画(transition)，在鼠标离开div时没有过渡动画。并给出如下解决文案：</p>
<div class="code">
	<span class="css-selector">div span {</span><br />
	<span class="css-name">&nbsp;&nbsp;&nbsp;&nbsp;transition:<span class="css-value"> 1s transform</span>;</span><br />
	<span class="css-selector">}<br />
	div:hover span {</span><br />
	<span class="css-name">&nbsp;&nbsp;&nbsp;&nbsp;transform:<span class="css-value"> rotate(270deg)</span>;</span><br />
	}</div>
<p>
	这样，当鼠标进入和离开div时，都有过渡动画效果。其实我们可以进一步实现鼠标进入（mouseEnter）和鼠标离开（mouseLeave）的不同效果。</p>
<div class="code">
	<span class="css-selector"><span class="css-comment">/*mouseleave*/</span><br />
	div span {</span><br />
	<span class="css-name">&nbsp;&nbsp;&nbsp;&nbsp;transition:<span class="css-value"> 3s transform</span>;</span><br />
	<span class="css-selector">}<br />
	<span class="css-comment">/*mouseenter*/</span><br />
	div:hover span {</span><br />
	<span class="css-name">&nbsp;&nbsp;&nbsp;&nbsp;transform:<span class="css-value"> rotate(270deg)</span>;<br />
	&nbsp;&nbsp;&nbsp;&nbsp;transition:<span class="css-value"> 1s transform</span>;</span><br />
	}</div>
<p>
	这样，就实现了mouseLeave和mouseEnter的不同过渡效果。</p>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/290/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>label导致冒泡事件的诡异问题</title>
		<link>http://dovapour.info/archives/285</link>
		<comments>http://dovapour.info/archives/285#comments</comments>
		<pubDate>Thu, 17 Mar 2011 06:47:11 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[bubble]]></category>
		<category><![CDATA[event]]></category>

		<guid isPermaLink="false">http://dovapour.info/?p=285</guid>
		<description><![CDATA[今天遇到一个很怪异的问题，给label标签绑定了click事件，但是每次单击时，click事件都会执行两次。开始以为自己的代码有问题，反复痛苦的检查了N久以后，才发现自己代码没问题。根本原因在于事件的冒泡机制和label标签共同作用引起的。 &#60;ul id=&#34;sdfsde&#34; class=&#34;multi-list&#34;&#62; &#160;&#160;&#160;&#160;&#60;li&#62;&#60;label for=&#34;q1&#34;&#62;&#60;input id=&#34;q1&#34; type=&#34;text&#34; value=&#34;&#34; /&#62;工商&#60;/label&#62;&#60;/li&#62; &#160;&#160;&#160;&#160;&#60;li&#62;&#60;label for=&#34;q2&#34;&#62;&#60;input id=&#34;q2&#34; type=&#34;text&#34; value=&#34;&#34; /&#62;农业&#60;/label&#62;&#60;/li&#62; &#160;&#160;&#160;&#160;&#60;li&#62;&#60;label for=&#34;q3&#34;&#62;&#60;input id=&#34;q3&#34; type=&#34;text&#34; value=&#34;&#34; /&#62;招商&#60;/label&#62;&#60;/li&#62; &#160;&#160;&#160;&#160;&#60;li&#62;&#60;label for=&#34;q4&#34;&#62;&#60;input id=&#34;q4&#34; type=&#34;text&#34; value=&#34;&#34; /&#62;建设&#60;/label&#62;&#60;/li&#62; &#160;&#160;&#160;&#160;&#60;li&#62;&#60;label for=&#34;q5&#34;&#62;&#60;input id=&#34;q5&#34; type=&#34;text&#34; value=&#34;&#34; /&#62;浦发&#60;/label&#62;&#60;/li&#62; &#60;/ul&#62; 执行两次的过程如下： 单击label标签，第一次执行click事件 由于label标签的特殊性，事件向下传递到input标签 事件开始冒泡几上传递 冒泡到label标签时，第二次执行click事件 为了更便于说明上面的过程，请看下面的示例： &#60;label id=&#34;lbUser&#34;&#62; &#160;&#160;&#160;&#160;&#60;input id=&#34;txtUser&#34; type=&#34;text&#34; value=&#34;单击这里alert二次&#34; /&#62; &#160;&#160;&#160;&#160;单击这里alert三次 &#60;/label&#62; &#60;script type=&#34;text/javascript&#34;&#62; $(&#39;lbUser&#39;).click(function(){ &#160;&#160;&#160;&#160;alert(&#39;单击label&#39;); }); [...]]]></description>
			<content:encoded><![CDATA[<p>
	今天遇到一个很怪异的问题，给label标签绑定了click事件，但是每次单击时，click事件都会执行两次。开始以为自己的代码有问题，反复痛苦的检查了N久以后，才发现自己代码没问题。根本原因在于事件的冒泡机制和label标签共同作用引起的。</p>
<div class="code">
	<span class="xml-tag">&lt;ul id<span class="xml-string">=&quot;sdfsde&quot;</span> class<span class="xml-string">=&quot;multi-list&quot;</span>&gt;</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="xml-tag">&lt;li&gt;</span><span class="xml-tag">&lt;label for<span class="xml-string">=&quot;q1&quot;</span>&gt;</span><span class="xml-form">&lt;input id<span class="xml-string">=&quot;q1&quot;</span> type<span class="xml-string">=&quot;text&quot;</span> value=&quot;&quot; /&gt;</span>工商<span class="xml-tag">&lt;/label&gt;</span><span class="xml-tag">&lt;/li&gt;</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="xml-tag">&lt;li&gt;</span><span class="xml-tag">&lt;label for<span class="xml-string">=&quot;q2&quot;</span>&gt;</span><span class="xml-form">&lt;input id<span class="xml-string">=&quot;q2&quot;</span> type<span class="xml-string">=&quot;text&quot;</span> value=&quot;&quot; /&gt;</span>农业<span class="xml-tag">&lt;/label&gt;</span><span class="xml-tag">&lt;/li&gt;</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="xml-tag">&lt;li&gt;</span><span class="xml-tag">&lt;label for<span class="xml-string">=&quot;q3&quot;</span>&gt;</span><span class="xml-form">&lt;input id<span class="xml-string">=&quot;q3&quot;</span> type<span class="xml-string">=&quot;text&quot;</span> value=&quot;&quot; /&gt;</span>招商<span class="xml-tag">&lt;/label&gt;</span><span class="xml-tag">&lt;/li&gt;</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="xml-tag">&lt;li&gt;</span><span class="xml-tag">&lt;label for<span class="xml-string">=&quot;q4&quot;</span>&gt;</span><span class="xml-form">&lt;input id<span class="xml-string">=&quot;q4&quot;</span> type<span class="xml-string">=&quot;text&quot;</span> value=&quot;&quot; /&gt;</span>建设<span class="xml-tag">&lt;/label&gt;</span><span class="xml-tag">&lt;/li&gt;</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="xml-tag">&lt;li&gt;</span><span class="xml-tag">&lt;label for<span class="xml-string">=&quot;q5&quot;</span>&gt;</span><span class="xml-form">&lt;input id<span class="xml-string">=&quot;q5&quot;</span> type<span class="xml-string">=&quot;text&quot;</span> value=&quot;&quot; /&gt;</span>浦发<span class="xml-tag">&lt;/label&gt;</span><span class="xml-tag">&lt;/li&gt;</span><br />
	<span class="xml-tag">&lt;/ul&gt;</span></div>
<p>
	执行两次的过程如下：</p>
<ol>
<li>
		单击label标签，第一次执行click事件</li>
<li>
		由于label标签的特殊性，事件向下传递到input标签</li>
<li>
		事件开始冒泡几上传递</li>
<li>
		冒泡到label标签时，第二次执行click事件</li>
</ol>
<p>
	为了更便于说明上面的过程，请看下面的示例：</p>
<div class="code">
	<span class="xml-tag">&lt;label id<span class="xml-string">=&quot;lbUser&quot;</span>&gt;</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="xml-form">&lt;input id<span class="xml-string">=&quot;txtUser&quot;</span> type<span class="xml-string">=&quot;text&quot;</span> value<span class="xml-string">=&quot;单击这里alert二次&quot;</span> /&gt;</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;单击这里alert三次<br />
	<span class="xml-tag">&lt;/label&gt;</span><br />
	<span class="xml-script">&lt;script type=<span class="xml-script-quote">&quot;text/javascript&quot;</span>&gt;</span><br />
	$<span class="js-reserved">(</span><span class="js-string">&#39;lbUser&#39;</span><span class="js-reserved">)</span>.<span class="js-client">click</span><span class="js-reserved">(</span><span class="js-reserved">function</span><span class="js-reserved">(</span><span class="js-reserved">)</span><span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-client">alert</span><span class="js-reserved">(</span><span class="js-string">&#39;单击label&#39;</span><span class="js-reserved">)</span>;<br />
	<span class="js-reserved">}</span><span class="js-reserved">)</span>;<br />
	$<span class="js-reserved">(</span><span class="js-string">&#39;txtUser&#39;</span><span class="js-reserved">)</span>.<span class="js-client">click</span><span class="js-reserved">(</span><span class="js-reserved">function</span><span class="js-reserved">(</span><span class="js-reserved">)</span><span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-client">alert</span><span class="js-reserved">(</span><span class="js-string">&#39;单击input&#39;</span><span class="js-reserved">)</span>;<br />
	<span class="js-reserved">}</span><span class="js-reserved">)</span>;<br />
	<span class="xml-script">&lt;/script&gt;</span></div>
<p>
	当点击label中的文字时，依次弹出：</p>
<ol>
<li>
		alert(&#39;单击label&#39;)</li>
<li>
		alert(&#39;单击input&#39;);</li>
<li>
		alert(&#39;单击label&#39;);</li>
</ol>
<p>
	当直接点击input输入框时，依次弹出：</p>
<ol>
<li>
		alert(&#39;单击input&#39;);</li>
<li>
		alert(&#39;单击label&#39;);</li>
</ol>
<p>
	总结：这个问题让自己纠结了，很长时间。主要原因时没有考虑到冒泡，需要注意的这里我们注册的事件都是绑定在冒泡期间，但是因为label(<span style="color:#ff8c00;">会自动将焦点转到和标签相关的表单控件上</span>)，所以导致了这个意外。</p>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/285/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>非字母数字的JavaScript</title>
		<link>http://dovapour.info/archives/283</link>
		<comments>http://dovapour.info/archives/283#comments</comments>
		<pubDate>Fri, 11 Mar 2011 01:41:36 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[non-alphanumeric]]></category>

		<guid isPermaLink="false">http://dovapour.info/?p=283</guid>
		<description><![CDATA[由非字母数字组成的JavaScript，这是几年前一个日本安全专家Yosuke Hasegawa在slackers论坛上提出的。这种技术主要是利用JavaScript的数据类型自动转换的特性，例如布尔类型true、false可以转换成字符类型&#34;true&#34;、&#34;false&#34;。 现在我们利用上面这种技术来获取字母o，我们可以利用对象调用toString方法转换成字符串[object &#160;Object]来得到字母o。 1 首页我们需要获得对象字面量[object Object]: &#160;[{}]+[]//[object Object] &#160; 2 得到数字0 +[]//0&#160; &#160; 3 得到数字1，在0的基础上增加1 ++[+[]][+[]]//1&#160; &#160; 4最后合并上面代码，得到字母o &#160;alert([[{}]+[]][+[]][++[+[]][+[]]])//&#34;o&#34; &#160; 如果对这方面感兴趣，可以阅读： YAUC Less chars needed to run arbitrary JS code = 6! (JS GREAT WALL)&#160; http://sla.ckers.org/forum/read.php?24,32930 Diminuitive NonAlNum JS - Arbitrary:- http://sla.ckers.org/forum/read.php?24,35081 Java/script: no alnum cheat sheets:- http://sla.ckers.org/forum/read.php?24,33349 Diminutive JS Code Challenge, from OWASP [...]]]></description>
			<content:encoded><![CDATA[<p>
	由非字母数字组成的JavaScript，这是几年前一个日本安全专家Yosuke Hasegawa在<a href="http://sla.ckers.org/forum/">slackers</a>论坛上提出的。这种技术主要是利用JavaScript的数据类型自动转换的特性，例如布尔类型true、false可以转换成字符类型&quot;true&quot;、&quot;false&quot;。</p>
<p>
	现在我们利用上面这种技术来获取字母o，我们可以利用对象调用toString方法转换成字符串[object &nbsp;Object]来得到字母o。</p>
<p>
	1 首页我们需要获得对象字面量[object Object]:</p>
<div class="code">
	&nbsp;<span class="js-reserved">[</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-comment">//[object Object]</span></div>
<p>
	&nbsp;</p>
<p>
	2 得到数字0</p>
<div class="code">
	+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-comment">//0&nbsp;</span></div>
<p>
	&nbsp;</p>
<p>
	3 得到数字1，在0的基础上增加1</p>
<div class="code">
	++<span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-comment">//1&nbsp;</span></div>
<p>
	&nbsp;</p>
<p>
	4最后合并上面代码，得到字母o</p>
<div class="code">
	&nbsp;<span class="js-client">alert</span><span class="js-reserved">(</span><span class="js-reserved">[</span><span class="js-reserved">[</span><span class="js-reserved">{</span><span class="js-reserved">}</span><span class="js-reserved">]</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">[</span>++<span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">[</span>+<span class="js-reserved">[</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">]</span><span class="js-reserved">)</span><span class="js-comment">//&quot;o&quot;</span></div>
<p>
	&nbsp;</p>
<p>
	如果对这方面感兴趣，可以阅读：</p>
<p>
	YAUC Less chars needed to run arbitrary JS code = 6! (JS GREAT WALL)&nbsp;<br />
	<a href="http://sla.ckers.org/forum/read.php?24,32930" style="color: rgb(0, 0, 204); " target="_blank">http://sla.ckers.org/forum/<wbr>read.php?24,32930</wbr></a></p>
<p>	Diminuitive NonAlNum JS - Arbitrary:-<br />
	<a href="http://sla.ckers.org/forum/read.php?24,35081" style="color: rgb(0, 0, 204); " target="_blank">http://sla.ckers.org/forum/<wbr><wbr><wbr><wbr><wbr>read.php?24,35081</wbr></wbr></wbr></wbr></wbr></a></p>
<p>	Java/script: no alnum cheat sheets:-<br />
	<a href="http://sla.ckers.org/forum/read.php?24,33349" style="color: rgb(0, 0, 204); " target="_blank">http://sla.ckers.org/forum/read.php?24,33349</a></p>
<p>	Diminutive JS Code Challenge, from OWASP :-<br />
	<a href="http://sla.ckers.org/forum/read.php?24,30015" style="color: rgb(0, 0, 204); " target="_blank">http://sla.ckers.org/forum/read.php?24,30015</a></p>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/283/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>数组的小技巧</title>
		<link>http://dovapour.info/archives/279</link>
		<comments>http://dovapour.info/archives/279#comments</comments>
		<pubDate>Thu, 10 Mar 2011 08:27:11 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[array]]></category>

		<guid isPermaLink="false">http://dovapour.info/?p=279</guid>
		<description><![CDATA[JavaScript array &#8220;extras&#8221; in detail&#160;介绍了ES5对数组原型对象扩充的方法：forEach、map、filter、some、every、indexOf、lastIndexOf、reduce、reduceRight。这些方法不仅可以应用到数组，还可应用到拥有length属性，并且可以数字索引的对象上，例如String，arguments，DOM nodes collection等。 // get the reference to the map method var map = Array.prototype.map; // and call it for a string var hello = map.call(&#34;hello world&#34;, function (char) { &#160;&#160;return char + &#34;*&#34;; }); alert(hello.join(&#34;&#34;)); // &#34;h*e*l*l*o* *w*o*r*l*d*&#34; &#160; 除了上面这些ES5的方法，join方法也可应用到拥有length属性，并且可以数字索引的对象上，示例： var s = &#39;abcd&#39; &#160;&#160;&#160;&#160;f = Array.prototype.join; var str = [...]]]></description>
			<content:encoded><![CDATA[<p>
	<a href="http://dev.opera.com/articles/view/javascript-array-extras-in-detail">JavaScript array &ldquo;extras&rdquo; in detail</a>&nbsp;介绍了ES5对数组原型对象扩充的方法：forEach、map、filter、some、every、indexOf、lastIndexOf、reduce、reduceRight。这些方法不仅可以应用到数组，还可应用到拥有length属性，并且可以数字索引的对象上，例如String，arguments，DOM nodes collection等。</p>
<div class="code">
	<span class="js-comment">// get the reference to the map method</span><br />
	<span class="js-reserved">var</span> map = <span class="js-native">Array</span>.prototype.map;</p>
<p>	<span class="js-comment">// and call it for a string</span><br />
	<span class="js-reserved">var</span> hello = map.call<span class="js-reserved">(</span><span class="js-string">&quot;hello world&quot;</span>, <span class="js-reserved">function</span> <span class="js-reserved">(</span>char<span class="js-reserved">)</span> <span class="js-reserved">{</span><br />
	&nbsp;&nbsp;<span class="js-reserved">return</span> char + <span class="js-string">&quot;*&quot;</span>;<br />
	<span class="js-reserved">}</span><span class="js-reserved">)</span>;</p>
<p>	<span class="js-client">alert</span><span class="js-reserved">(</span>hello.<span class="js-native">join</span><span class="js-reserved">(</span>&quot;&quot;<span class="js-reserved">)</span><span class="js-reserved">)</span>; <span class="js-comment">// &quot;h*e*l*l*o* *w*o*r*l*d*&quot;</span></div>
<p>
	&nbsp;</p>
<p>
	除了上面这些ES5的方法，join方法也可应用到拥有length属性，并且可以数字索引的对象上，示例：</p>
<div class="code">
	<span class="js-reserved">var</span> s = <span class="js-string">&#39;abcd&#39;</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;f = <span class="js-native">Array</span>.prototype.<span class="js-native">join</span>;<br />
	<span class="js-reserved">var</span> str = f.call<span class="js-reserved">(</span>s, <span class="js-string">&#39;-&#39;</span><span class="js-reserved">)</span>;<br />
	<span class="js-client">alert</span><span class="js-reserved">(</span>str<span class="js-reserved">)</span>;<span class="js-comment">// a-b-c-d</span></div>
<p>
	&nbsp;</p>
<p>
	文中还有一个数组方法重用字符串方法的例子：</p>
<div class="code">
	<span class="js-comment">// reuse &quot;toUpperCase&quot; method</span><br />
	<span class="js-reserved">var</span> <span class="js-native">toUpperCase</span> = <span class="js-native">String</span>.prototype.<span class="js-native">toUpperCase</span>;<br />
	<span class="js-reserved">var</span> upper = <span class="js-native">toUpperCase</span>.apply<span class="js-reserved">(</span><span class="js-reserved">[</span><span class="js-string">&quot;foo&quot;</span>, <span class="js-string">&quot;bar&quot;</span><span class="js-reserved">]</span><span class="js-reserved">)</span>.<span class="js-native">split</span><span class="js-reserved">(</span><span class="js-string">&quot;,&quot;</span><span class="js-reserved">)</span>;<br />
	<span class="js-client">alert</span><span class="js-reserved">(</span>upper<span class="js-reserved">)</span>; <span class="js-comment">// [&quot;FOO&quot;, &quot;BAR&quot;]</span></div>
<p>
	&nbsp;</p>
<p>
	下面是<a href="http://ejohn.org/apps/learn/#41">John&nbsp;Resig</a>&nbsp;给出的获取数组最大与最小值的方法，很有创意：</p>
<div class="code">
	<span class="js-reserved">function</span> smallest<span class="js-reserved">(</span>array<span class="js-reserved">)</span><span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-native">Math</span>.<span class="js-native">min</span>.apply<span class="js-reserved">(</span> <span class="js-native">Math</span>, array <span class="js-reserved">)</span>;<br />
	<span class="js-reserved">}</span><br />
	<span class="js-reserved">function</span> largest<span class="js-reserved">(</span>array<span class="js-reserved">)</span><span class="js-reserved">{</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-reserved">return</span> <span class="js-native">Math</span>.<span class="js-native">max</span>.apply<span class="js-reserved">(</span> <span class="js-native">Math</span>, array <span class="js-reserved">)</span>;<br />
	<span class="js-reserved">}</span></div>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/279/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>关于typeof运算</title>
		<link>http://dovapour.info/archives/268</link>
		<comments>http://dovapour.info/archives/268#comments</comments>
		<pubDate>Mon, 07 Mar 2011 08:49:05 +0000</pubDate>
		<dc:creator>dovapour</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[error]]></category>
		<category><![CDATA[typeof]]></category>

		<guid isPermaLink="false">http://dovapour.info/?p=268</guid>
		<description><![CDATA[在JavaScript中，变量可以不声明直接赋值使用，但不能直接引用，否则会出错，看下面代码： console.log(foo); //reference error if(foo){ //reference error &#160;&#160;&#160;&#160;alert(&#39;true&#39;); } typeof(foo); //undefined 看了上面代码对于进行typeof运算为什么不报错，而是返回undefined，这是因为typeof操作并不调用GetValue。ECMA中关于typeof操作的描述： The production UnaryExpression : typeof UnaryExpression is evaluated as follows: Let val be the result of evaluating UnaryExpression If Type(val) is Reference, then If IsUnresolvableReference(val) is true, return &#34;undefined&#34; Let val be GetValue(val) Return a String determined by Type(val) according to Table typeof [...]]]></description>
			<content:encoded><![CDATA[<p>
	在JavaScript中，变量可以不声明直接赋值使用，但不能直接引用，否则会出错，看下面代码：</p>
<div class="code">
	console.<span class="js-client"><span class="js-native">log</span></span><span class="js-reserved">(</span>foo<span class="js-reserved">)</span>; <span class="js-comment">//reference error</span><br />
	<span class="js-reserved">if</span><span class="js-reserved">(</span>foo<span class="js-reserved">)</span><span class="js-reserved">{</span> <span class="js-comment">//reference error</span><br />
	&nbsp;&nbsp;&nbsp;&nbsp;<span class="js-client">alert</span><span class="js-reserved">(</span><span class="js-string">&#39;true&#39;</span><span class="js-reserved">)</span>;<br />
	<span class="js-reserved">}</span><br />
	<span class="js-native">typeof</span><span class="js-reserved">(</span>foo<span class="js-reserved">)</span>; <span class="js-comment">//undefined</span></div>
<p>
	看了上面代码对于进行typeof运算为什么不报错，而是返回undefined，这是因为typeof操作并不调用GetValue。ECMA中关于<a href="http://ecma262-5.com/ELS5_HTML.htm#Section_11.4.3">typeof</a>操作的描述：</p>
<blockquote>
<p>
		The production UnaryExpression : typeof UnaryExpression is evaluated as follows:</p>
<ol>
<li>
			Let val be the result of evaluating UnaryExpression</li>
<li>
			If Type(val) is Reference, then</p>
<ul>
<li>
					If IsUnresolvableReference(val) is true, return &quot;undefined&quot;</li>
<li>
					Let val be GetValue(val)</li>
</ul>
</li>
<li>
			Return a String determined by Type(val) according to Table</li>
</ol>
</blockquote>
<table border="1" cellpadding="1" cellspacing="1" style="width: 500px; " summary="typeof Operator Results">
<caption>
		typeof Operator Results</caption>
<tbody>
<tr>
<td style="width: 50%; text-align: center; ">
				typeof val</td>
<td style="text-align: center; ">
				result</td>
</tr>
<tr>
<td>
				undefined</td>
<td>
				&quot;undefined&quot;</td>
</tr>
<tr>
<td>
				Null</td>
<td>
				&quot;object&quot;</td>
</tr>
<tr>
<td>
				Boolean</td>
<td>
				&quot;boolean&quot;</td>
</tr>
<tr>
<td>
				Number</td>
<td>
				&quot;number&quot;</td>
</tr>
<tr>
<td>
				String</td>
<td>
				&quot;string&quot;</td>
</tr>
<tr>
<td>
				Object (native and does not implement [[Call]])</td>
<td>
				&quot;object&quot;</td>
</tr>
<tr>
<td>
				Object (native or host and does implement [[Call]])</td>
<td>
				&quot;function&quot;</td>
</tr>
<tr>
<td>
				Object (host and does not implement [[Call]])</td>
<td>
				Implementation-defined except may not be &quot;<code style="font-style: normal; color: black; font-weight: bold; font-family: monospace; ">undefined</code>&quot;, &quot;<code style="font-style: normal; color: black; font-weight: bold; font-family: monospace; ">boolean</code>&quot;, &quot;<code style="font-style: normal; color: black; font-weight: bold; font-family: monospace; ">number</code>&quot;, or &quot;<code style="font-style: normal; color: black; font-weight: bold; font-family: monospace; ">string</code>&quot;.</td>
</tr>
</tbody>
</table>
<p>
	&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://dovapour.info/archives/268/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

