�??xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/"><channel><title>&#20122;&#27954;&#32;&#22269;&#20135;&#32;&#22270;&#29255;&#44;&#33394;&#31389;&#31389;&#20122;&#27954;&#97;&#118;&#32593;&#44;&#26085;&#25209;&#26085;&#20986;&#27700;&#20037;&#20037;&#20122;&#27954;&#31934;&#21697;&#116;&#118;</title><link>http://www.tkk7.com/joan/category/33809.html</link><description>�U�は张で

</description><language>zh-cn</language><lastBuildDate>Thu, 07 Jan 2010 04:41:33 GMT</lastBuildDate><pubDate>Thu, 07 Jan 2010 04:41:33 GMT</pubDate><ttl>60</ttl><item><title>jquery  实用收藏</title><link>http://www.tkk7.com/joan/articles/307918.html</link><dc:creator>joan</dc:creator><author>joan</author><pubDate>Thu, 31 Dec 2009 07:36:00 GMT</pubDate><guid>http://www.tkk7.com/joan/articles/307918.html</guid><wfw:comment>http://www.tkk7.com/joan/comments/307918.html</wfw:comment><comments>http://www.tkk7.com/joan/articles/307918.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.tkk7.com/joan/comments/commentRss/307918.html</wfw:commentRss><trackback:ping>http://www.tkk7.com/joan/services/trackbacks/307918.html</trackback:ping><description><![CDATA[<h2>概述<a ></a></h2>
<p>jQuery 是�� prototype 之后又一个优�U��?Javascript 框架。其宗旨是—写更少的代�?做更多的事情。它是轻量���?js �?压羃后只�?1k) �Q�这是其它的 js 库所�?a ></a>�?qi��ng)的�Q�它兼容 CSS3�Q�还兼容各种���览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+�Q��?jQuery 是一个快速的�Q�简�z�的 javaScript 库，使用戯���更方便地处理 HTML documents、events、实现动��L��果，�q�且方便��Cؓ(f��)�|�站提供 AJAX 交互�?jQuery �q�有一个比较大的优势是�Q�它的文档说明很全，而且各种应用也说得很详细�Q�同时还有许多成熟的插�g可供选择�?jQuery 能够使用��L(f��ng)�� html ��保持代码和 html 内容分离�Q�也���是��_(d��)��不用再在 html 里面插入一堆js来调用命令了�Q�只需定义 id 卛_��。今天在<a title="Logo Kollermedia.at" >Kollermedia.at</a>上发��C��一���JQuery插�g列表�?a  target="_blank">文章</a>�Q�特推荐如下�?/p>
<h2>文�g上传(File upload)<a ></a></h2>
<p><a >Ajax File Upload</a>.<br />
<a >jQUploader</a>.<br />
<a >Multiple File Upload plugin</a>.&nbsp; <br />
<a >jQuery File Style</a>.<br />
<a >Styling an input type file</a>.<br />
<a >Progress Bar Plugin</a>. </p>
<h2>表单验证(Form Validation)</h2>
<p><a >jQuery Validation</a>.<br />
<a >Auto Help</a>.<br />
<a >Simple jQuery form validation</a>.<br />
<a >jQuery XAV - form validations</a>.<br />
<a >jQuery AlphaNumeric</a>.<br />
<a >Masked Input</a>.<br />
<a >TypeWatch Plugin</a>.<br />
<a >Text limiter for form fields</a>.<br />
<a >Ajax Username Check with jQuery</a>.
<h2>表单�Q�选取�?Form - Select Box stuff)</h2>
<p><a >jQuery Combobox</a>.<br />
<a >jQuery controlled dependent (or Cascadign) Select List</a>.<br />
<a >Multiple Selects</a>.<br />
<a >Select box manipulation</a>.<br />
<a >Select Combo Plugin</a>.<br />
<a >jQuery - LinkedSelect</a><br />
<a >Auto-populate multiple select boxes</a>.<br />
<a >Choose Plugin (Select Replacement)</a>.
<h2>表单基本、输入框、选择框等(Form Basics, Input Fields, Checkboxes etc.)</h2>
<p><a >jQuery Form Plugin</a>.<br />
<a >jQuery-Form</a>.<br />
<a >jLook Nice Forms</a>.<br />
<a >jNice</a>.<br />
<a >Ping Plugin</a>.<br />
<a >Toggle Form Text</a>.<br />
<a >ToggleVal</a>.<br />
<a >jQuery Field Plugin</a>.<br />
<a >jQuery Form&#8217;n Field plugin</a>.<br />
<a >jQuery Checkbox manipulation</a>.<br />
<a >jTagging</a>.<br />
<a >jQuery labelcheck</a>.<br />
<a >Overlabel</a>.<br />
<a >3 state radio buttons</a>.<br />
<a >ShiftCheckbox jQuery Plugin</a>.<br />
<a >Watermark Input</a>.<br />
<a >jQuery Checkbox (checkboxes with imags)</a>.<br />
<a >jQuery SpinButton Control</a>.<br />
<a >jQuery Ajax Form Builder</a>.<br />
<a >jQuery Focus Fields</a>.<br />
<a >jQuery Time Entry</a>.
<h2>旉���、日期和颜色选取(Time, Date and Color Picker)</h2>
<p><a >jQuery UI Datepicker</a>.<br />
<a >jQuery date picker plugin</a>.<br />
<a >jQuery Time Picker</a>.<br />
<a >Time Picker</a>.<br />
<a >ClickPick</a>.<br />
<a >TimePicker</a>.<br />
<a >Farbtastic jQuery Color Picker Plugin</a>.<br />
<a >Color Picker by intelliance.fr</a>.
<h2>投票插�g(Rating Plugins)</h2>
<p><a >jQuery Star Rating Plugin</a>.<br />
<a >jQuery Star Rater</a>.<br />
<a >Content rater with asp.net, ajax and jQuery</a>.<br />
<a >Half-Star Rating Plugin</a>.
<h2>搜烦插�g(Search Plugins)</h2>
<p><a >jQuery Suggest</a>.<br />
<a >jQuery Autocomplete</a>.<br />
<a >jQuery Autocomplete Mod</a>.<br />
<a >jQuery Autocomplete by AjaxDaddy</a>.<br />
<a >jQuery Autocomplete Plugin with HTML formatting</a>.<br />
<a >jQuery Autocompleter</a>.<br />
<a >AutoCompleter (Tutorial with PHP&amp;MySQL)</a>.<br />
<a >quick Search jQuery Plugin</a>.
<h2>�~�辑�?Inline Edit &amp; Editors)<a ></a></h2>
<p><a >jTagEditor</a>.<br />
<a >WYMeditor</a>.<br />
<a >jQuery jFrame</a>.<br />
<a >Jeditable - edit in place plugin for jQuery</a>. <br />
<a >jQuery editable</a>.<br />
<a >jQuery Disable Text Select Plugin</a>.<br />
<a >Edit in Place with Ajax using jQuery</a>.<br />
<a >jQuery Plugin - Another In-Place Editor</a>.<br />
<a >TableEditor</a>.<br />
<a >tEditable - in place table editing for jQuery</a>.
<h2>多媒体、视频、Flash�{?Audio, Video, Flash, SVG, etc)</h2>
<p><a >jMedia - accessible multi-media embedding</a>.<br />
<a >JBEdit - Ajax online Video Editor</a>.<br />
<a >jQuery MP3 Plugin</a>.<br />
<a >jQuery Media Plugin</a>.<br />
<a >jQuery Flash Plugin</a>.<br />
<a >Embed QuickTime</a>.<br />
<a >SVG Integration</a>.
<h2>囄���(Photos/Images/Galleries)</h2>
<p><a >ThickBox</a>.<br />
<a >jQuery lightBox plugin</a>.<br />
<a >jQuery Image Strip</a>.<br />
<a >jQuery slideViewer</a>.<br />
<a >jQuery jqGalScroll 2.0</a>.<br />
<a >jQuery - jqGalViewII</a>.<br />
<a >jQuery - jqGalViewIII</a>.<br />
<a >jQuery Photo Slider</a>.<br />
<a >jQuery Thumbs - easily create thumbnails</a>.<br />
<a >jQuery jQIR Image Replacement</a>.<br />
<a >jCarousel Lite</a>.<br />
<a >jQPanView</a>.<br />
<a >jCarousel</a>.<br />
<a >Interface Imagebox</a>.<br />
<a >Image Gallery using jQuery, Interface &amp; Reflactions</a>.<br />
<a >simple jQuery Gallery</a>.<br />
<a >jQuery Gallery Module</a>.<br />
<a >EO Gallery</a>.<br />
<a >jQuery ScrollShow</a>.<br />
<a >jQuery Cycle Plugin</a>.<br />
<a >jQuery Flickr</a>.<br />
<a >jQuery Lazy Load Images Plugin</a>.<br />
<a >Zoomi - Zoomable Thumbnails</a>.<br />
<a >jQuery Crop - crop any image on the fly</a>.<br />
<a >Image Reflection</a>.
<h2>Google地图�Q�Google Map�Q?/h2>
<p><a >jQuery Plugin googlemaps</a>.<br />
<a >jMaps jQuery Maps Framework</a>.<br />
<a >jQmaps</a>.<br />
<a >jQuery &amp; Google Maps</a>.<br />
<a >jQuery Maps Interface forr Google and Yahoo maps</a>.<br />
<a >jQuery J Maps - by Tane Piper</a>.
<h2>游戏(Games)</h2>
<p><a >Tetris with jQuery</a>.<br />
<a >jQuery Chess</a>.<br />
<a >Mad Libs Word Game</a>.<br />
<a >jQuery Puzzle</a>.<br />
<a >jQuery Solar System (not a game but awesome jQuery Stuff)</a>.
<h2>表格�{?Tables, Grids etc.)</h2>
<p><a >UI/Tablesorter</a>.<a ><img style="border-top-width: 0px; border-left-width: 0px; border-bottom-width: 0px; border-right-width: 0px" height="143" alt="JQuery_003" src="http://images.cnblogs.com/cnblogs_com/Terrylee/WindowsLiveWriter/240jQuery_128F5/JQuery_003_thumb.gif" width="400" align="right" border="0" /></a> <br />
<a >jQuery ingrid</a>.<br />
<a >jQuery Grid Plugin</a>.<br />
<a >Table Filter - awesome!</a>.<br />
<a >TableEditor</a>.<br />
<a >jQuery Tree Tables</a>.<br />
<a >Expandable &#8220;Detail&#8221; Table Rows</a>.<br />
<a >Sortable Table ColdFusion Costum Tag with jQuery UI</a>.<br />
<a >jQuery Bubble</a>.<br />
<a >TableSorter</a>.<br />
<a >Scrollable HTML Table</a>.<br />
<a >jQuery column Manager Plugin</a>.<br />
<a >jQuery tableHover Plugin</a>.<br />
<a >jQuery columnHover Plugin</a>.<br />
<a >jQuery Grid</a>.<br />
<a >TableSorter plugin for jQuery</a>.<br />
<a >tEditable - in place table editing for jQuery</a>.<br />
<a >jQuery charToTable Plugin</a>.<br />
<a >jQuery Grid Column Sizing</a>.<br />
<a >jQuery Grid Row Sizing</a>.
<h2>�l�计�?Charts, Presentation etc.)</h2>
<p><a >jQuery Wizard Plugin </a>.<br />
<a >jQuery Chart Plugin</a>.<br />
<a >Bar Chart</a>.
<h2>�Ҏ(gu��)��、圆角、背�?Border, Corners, Background)</h2>
<p><a >jQuery Corner</a>.<br />
<a >jQuery Curvy Corner</a>.<br />
<a >Nifty jQuery Corner</a>.<br />
<a >Transparent Corners</a>.<br />
<a >jQuery Corner Gallery</a>.<br />
<a >Gradient Plugin</a>.
<h2>文字和超链接(Text and Links)</h2>
<p><a >jQuery Spoiler plugin</a>.<br />
<a >Text Highlighting</a>.<br />
<a >Disable Text Select Plugin</a>.<br />
<a >jQuery Newsticker</a>.<br />
<a >Auto line-height Plugin</a>.<br />
<a >Textgrad - a text gradient plugin</a>.<br />
<a >LinkLook - a link thumbnail preview</a>.<br />
<a >pager jQuery Plugin</a>.<br />
<a >shortKeys jQuery Plugin</a>.<br />
<a >jQuery Biggerlink</a>.<br />
<a >jQuery Ajax Link Checker</a>.
<h2>鼠标提示�Q�Tooltips�Q?/h2>
<p><a >jQuery Plugin - Tooltip</a>.<br />
<a >jTip - The jQuery Tool Tip</a>.<br />
<a >clueTip</a>.<br />
<a >BetterTip</a>.<br />
<a >Flash Tooltips using jQuery</a>.<br />
<a >ToolTip</a>.
<h2>菜单和导�?Menus, Navigations)</h2>
<p><a >jQuery Tabs Plugin - awesome! </a>. [<a >demo nested tabs</a>.]<br />
<a >another jQuery nested Tab Set example (based on jQuery Tabs Plugin)</a>.<br />
<a >jQuery idTabs</a>.<br />
<a >jdMenu - Hierarchical Menu Plugin for jQuery</a>.<br />
<a >jQuery SuckerFish Style</a>.<br />
<a >jQuery Plugin Treeview</a>.<br />
<a >treeView Basic</a>.<br />
<a >FastFind Menu</a>.<br />
<a >Sliding Menu</a>.<br />
<a >Lava Lamp jQuery Menu</a>.<br />
<a >jQuery iconDock</a>.<br />
<a >jVariations Control Panel</a>.<br />
<a >ContextMenu plugin</a>.<br />
<a >clickMenu</a>.<br />
<a >CSS Dock Menu</a>.<br />
<a >jQuery Pop-up Menu Tutorial</a>.<br />
<a >Sliding Menu</a>. </p>
<p><a title="http://stilbuero.de/jquery/tabs_3/" >http://stilbuero.de/jquery/tabs_3/</a> </p>
<h2>�qȝ��、翻转等(Accordions, Slide and Toggle stuff)</h2>
<p><a >jQuery Plugin Accordion</a>.<br />
<a >jQuery Accordion Plugin Horizontal Way</a>.<br />
<a >haccordion - a simple horizontal accordion plugin for jQuery</a>.<br />
<a >Horizontal Accordion by portalzine.de</a>.<br />
<a >HoverAccordion</a>.<br />
<a >Accordion Example from fmarcia.info</a>.<br />
<a >jQuery Accordion Example</a>.<br />
<a >jQuery Demo - Expandable Sidebar Menu</a>.<br />
<a >Sliding Panels for jQuery</a>.<br />
<a >jQuery ToggleElements</a>.<br />
<a >Coda Slider</a>.<br />
<a >jCarousel</a>.<br />
<a >Accesible News Slider Plugin</a>.<br />
<a >Showing and Hiding code Examples</a>.<br />
<a >jQuery Easing Plugin</a>.<br />
<a >jQuery Portlets</a>.<br />
<a >AutoScroll</a>.<br />
<a >Innerfade</a>.
<h2>拖放插�g(Drag and Drop)</h2>
<p><a >UI/Draggables</a>.<br />
<a >EasyDrag jQuery Plugin</a>.<br />
<a >jQuery Portlets</a>.<br />
<a >jqDnR - drag, drop resize</a>.<br />
<a >Drag Demos</a>.
<h2>XML XSL JSON Feeds</h2>
<p><a >XSLT Plugin</a>.<br />
<a >jQuery Ajax call and result XML parsing</a>.<br />
<a >xmlObjectifier - Converts XML DOM to JSON</a>.<br />
<a >jQuery XSL Transform</a>.<br />
<a >jQuery Taconite - multiple Dom updates</a>.<br />
<a >RSS/ATOM Feed Parser Plugin</a>.<br />
<a >jQuery Google Feed Plugin</a>.
<h2>���览�?Browserstuff)</h2>
<p><a >Wresize - IE Resize event Fix Plugin</a>.<br />
<a >jQuery ifixpng</a>.<br />
<a >jQuery pngFix</a>.<br />
<a >Link Scrubber - removes the dotted line onfocus from links</a>.<br />
<a >jQuery Perciformes - the entire suckerfish familly under one roof</a>.<br />
<a >Background Iframe</a>.<br />
<a >QinIE - for proper display of Q tags in IE</a>.<br />
<a >jQuery Accessibility Plugin</a>.<br />
<a >jQuery MouseWheel Plugin</a>.
<h2>对话框、确认窗�?Alert, Prompt, Confirm Windows)</h2>
<p><a >jQuery Impromptu</a>.<br />
<a >jQuery Confirm Plugin</a>.<br />
<a >jqModal</a>.<br />
<a >SimpleModal</a>.
<h2>CSS</h2>
<p><a >jQuery Style Switcher</a>.<br />
<a >JSS - Javascript StyleSheets</a>.<br />
<a >jQuery Rule - creation/manipulation of CSS Rules</a>.<br />
<a >jPrintArea</a>.
<h2>DOM、AJAX和其它JQuery插�g�Q�DOM, Ajax and other jQuery plugins�Q?/h2>
<p><a >FlyDOM</a>.<br />
<a >jQuery Dimenion Plugin</a>.<br />
<a >jQuery Loggin</a>.<br />
<a >Metadata - extract metadata from classes, attributes, elements</a>.<br />
<a >Super-tiny Client-Side Include Javascript jQuery Plugin</a>.<br />
<a >Undo Made Easy with Ajax</a>.<br />
<a >JHeartbeat - periodically poll the server</a>.<br />
<a >Lazy Load Plugin</a>.<br />
<a >Live Query</a>.<br />
<a >jQuery Timers</a>.<br />
<a >jQuery Share it - display social bookmarking icons</a>.<br />
<a >jQuery serverCookieJar</a>.<br />
<a >jQuery autoSave</a>.<br />
<a >jQuery Puffer</a>.<br />
<a >jQuery iFrame Plugin</a>.<br />
<a >Cookie Plugin for jQuery</a>.<br />
<a >jQuery Spy - awesome plugin</a>.<br />
<a >Effect Delay Trick</a>.<br />
<a >jQuick - a quick tag creator for jQuery</a>.<a ><br />
Metaobjects</a>.<br />
<a >elementReady</a>.
<p>英文�Q?a title="http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/" >http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/</a></p>
<img src ="http://www.tkk7.com/joan/aggbug/307918.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.tkk7.com/joan/" target="_blank">joan</a> 2009-12-31 15:36 <a href="http://www.tkk7.com/joan/articles/307918.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>JavaScript多线�E�编�E?/title><link>http://www.tkk7.com/joan/articles/232317.html</link><dc:creator>joan</dc:creator><author>joan</author><pubDate>Sat, 04 Oct 2008 06:18:00 GMT</pubDate><guid>http://www.tkk7.com/joan/articles/232317.html</guid><wfw:comment>http://www.tkk7.com/joan/comments/232317.html</wfw:comment><comments>http://www.tkk7.com/joan/articles/232317.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.tkk7.com/joan/comments/commentRss/232317.html</wfw:commentRss><trackback:ping>http://www.tkk7.com/joan/services/trackbacks/232317.html</trackback:ping><description><![CDATA[<h3>
<div   id="6o64uks"   class="blog_content">
<h3>AJAX 开发中的难�?/h3>
<p>让我们通过一个简单的例子来认识这个问题。假设你要徏立一个树(w��i)形结构的公告栏系�l?BBS)�Q�它可以�Ҏ(gu��)��用户��h��与服务器�q�行交互�Q�动态加载每���文章的信息�Q�而不是一�ơ性从服务器蝲入所有文章信息。每���文章有四个相关属性：(x��)�pȝ��中可以作为唯一标识的ID、发贴�h姓名、文章内容以�?qi��ng)包含其所有子文章ID的数�l�信息。首先假定有一个名为getArticle()的函数可以加载一���文章信息。该函数接收的参数是要加载文章的ID�Q�通过它可从服务器获取文章信息。它�q�回的对象包含与文章相关的四条属性：(x��)id�Q�name�Q�content和children。例�E�如下：(x��)</p>
<pre>function ( id ) {
var a = getArticle(id);
document.writeln(a.name + "
" + a.content);
} </pre>
<p>然而你也许�?x��)注意到�Q�重复用同一个文章ID调用此函敎ͼ�需要与服务器之间进行反复且无益的通信。想要解册���个问题，可以考虑使用函数 getArticleWithCache()�Q�它相当于一个带有缓存能力的getArticle()。在�q�个例子中，getArticle()�q�回的数据只是作��Z��个全局变量被保存下来：(x��)</p>
<pre>var cache = {};
function getArticleWithCache ( id ) {
if ( !cache[id] ) {
cache[id] = getArticle(id);
}
return cache[id];
} </pre>
<p>现在已将��d��的文章缓存�v来，让我们再来考虑一下函数backgroundLoad()�Q�它应用我们上面提到的缓存机制加载所有文章信息。其用途是�Q�当读者在阅读某篇文章�Ӟ��从后台预加蝲它所有子文章。因为文章数据是�?w��i)状�l�构的，所以很�Ҏ(gu��)��写一个递归的算法来遍历�?w��i)�ƈ且加载所有的文章�Q?/p>
<pre>function backgroundLoad ( ids ) {
for ( var i=0; i &lt; ids.length; i++ ) {
var a = getArticleWithCache(ids[i]);
backgroundLoad(a.children);
}
} </pre>
<p>backgroundLoad ()函数接收一个ID数组作�ؓ(f��)参数�Q�然后通过每个ID调用前面定义�q�的getArticldWithCache()�Ҏ(gu��)���Q�这样就把每个ID对应的文章缓存�v来。之后再通过已加载文章的子文章ID数组递归调用backgroundLoad()�Ҏ(gu��)���Q�如此整个文章树(w��i)���p���~�存��h���?/p>
<p>到目前�ؓ(f��)止，一切似乎看��h��都很完美。然而，只要你有�q�开发AJAX应用的经验，你就应该知晓�q�种�q�稚的实现方法根本不�?x��)成功，�q�个例子成立的基���是默�?getArticle()用的是同步通信。可是，作�ؓ(f��)一条基本原则，JavaScript要求在与服务器进行交互时要用异步通信�Q�因为它是单�U�程的。就���单性而言�Q�把每一件事情（包括GUI事�g和渲染）都放在一个线�E�里来处理是一个很好的�E�序模型�Q�因�����样就无需再考虑�U�程同步�q�些复杂问题。另一斚w���Q�他也暴露了应用开发中的一个严重问题，单线�E�环境看��h��对用戯���求响应迅速，但是当线�E�忙于处理其它事情时(比如说调用getArticle())�Q�就不能对用��L(f��ng)��鼠标点击和键盘操作做出响应�?</p>
<p>如果在这个单�U�程环境里进行同步通信�?x��)发生什么事情呢�Q�同步通信�?x��)中断浏览器的执行直臌���得通信�l�果。在�{�待通信�l�果的过�E�中�Q�由于服务器的调用还没有完成�Q�线�E�会(x��)停止响应用户�q�保持锁定状态直到调用返回。因�����个原因，当浏览器在等待服务器响应时它不能对用戯�����Z��出响应，所以看��h��像是�ȝ��了。当执行 getArticleWithCache()和backgroundLoad()�?x��)有同样的问题，因��?f��)它们都是��Z��getArticle()函数的。由于下载所有的文章可能�?x��)耗费很可观的一�D�|����_(d��)��因此对于backgroundLoad()函数来说�Q�浏览器在此�D�|��间内的冻�l�就是一个很严重的问题——既然浏览器都已�l�冻�l�，当用��h��在阅��L��章时��׃��可能首先��L��行后台预加蝲数据�Q�如果这样做�q�当前的文章都没办法诅R�?/p>
<p>如上所�q�ͼ�既然同步通信在��用中�?x��)造成如此严重的问题，JavaScript���把异步通信作�ؓ(f��)一条基本原则。因此，我们可以��Z��异步通信改写上面的程序�?JavaScript要求以一�U�事仉���动的�E�序设计方式来写异步通信�E�序。在很多场合中，你都必须指定一个回调程序，一旦收到通信响应�Q�这个函数就�?x��)被调用。例如，上面定义的getArticleWithCache()可以写成�q�样�Q?/p>
<pre>var cache = {};
function getArticleWithCache ( id, callback ) {
if ( !cache[id] ) {
callback(cache[id]);
} else {
getArticle(id, function( a ){
cache[id] = a;
callback(a);
});
}
} </pre>
<p>�q�个�E�序也在内部调用了getArticle()函数。然而需要注意的是，为异步通信设计的这版getArticle()函数要接收一个函��C��为第二个参数。当调用�q�个getArticle()函数�Ӟ��与从前一栯����l�服务器发送一个请求，不同的是�Q�现在函��C��(x��)�q�速返回而非�{�待服务器的响应。这意味着�Q�当执行权交回给调用�E�序�Ӟ���q�没有得到服务器的响应。如此一来，�U�程���可以去执行其它��d��直至获得服务器响应，�q�在此时调用回调函数。一旦得到服务器响应�Q?getArticle()的第二个参数作�ؓ(f��)预先定义的回调函数就要被调用�Q�服务器的返回值即为其参数。同��L(f��ng)���Q�getArticleWithCache ()也要做些改变�Q�定义一个回调参��C��为其�W�二个参数。这个回调函数将在被传给getArticle()的回调函��C��调用�Q�因而它可以在服务器通信�l�束后被执行�?/p>
<p>单是上面�q�些改动你可能已�l�认为相当复杂了�Q�但是对backgroundLoad()函数做得改动���会(x��)更复杂，它也要被改写成可以处理回调函数的形式�Q?/p>
<pre>function backgroundLoad ( ids, callback ) {
var i = 0;
function l ( ) {
if ( i &lt; ids.length ) {
getArticleWithCache(ids[i++], function( a ){
backgroundLoad(a.children, l);
});
} else {
callback();
}
}
l();
} </pre>
<p>改动后的backgroundLoad()函数看上��d��我们以前的那个函数已�l�相�ȝ���q�，不过他们所实现的功能�ƈ无二致。这意味着�q�两个函数都接受ID数组作�ؓ(f��)参数�Q�对于数�l�里的每个元素都要调用getArticleWithCache()�Q�再应用已经获得子文章ID递归调用backgroundLoad ()。不�q�同��h���Ҏ(gu��)���l�的循环讉K���Q�新函数中的��׃��太好辨认了，以前的程序中是用一个for循环语句完成的。�ؓ(f��)什么实现同样功能的两套函数是如此的大相径庭呢？</p>
<p>�q�个差异源于一个事实：(x��)��M��函数在遇到有需要同服务器进行通信情况后，都必��ȝ��刻返回，例如getArticleWithCache()。除非原来的函数不在执行当中�Q�否则应当接受服务器响应的回调函数都不能被调用。对于JavaScript�Q�在循环�q�程中中断程序�ƈ在稍后从�q�个断点�l�箋开始执行程序是不可能的�Q�例如一个for语句。因此，本例利用递归传递回调函数实现��@环结构而非一个传�l���@环语句。对那些熟�?zh��n)��q�箋传送风�?CPS)的�h来说�Q�这���是一�?CPS的手动实玎ͼ�因�ؓ(f��)不能使用循环语法�Q�所以即便如前面提到的遍历树(w��i)那么���单的�E�序也得写得很复杂。与事�g驱动�E�序设计相关的问题是<a >控制���问�?/a>�Q���@环和其它控制���表辑ּ�可能比较隄���解�?/p>
<p>�q�里�q�有另外一个问题：(x��)如果你把一个没有应用异步通信的函数�{换�ؓ(f��)一个��用异步通信的函敎ͼ�那么重写的函数将需要一个回调函��C��为新增参敎ͼ��q��ؓ(f��)已经存在的APIs造成了很大问题，因�ؓ(f��)内在的改变没有把影响限于内部�Q�而是��D��整体混�ؕ的APIs以及(qi��ng)API的其它��用者的改变�?/p>
<p>造成�q�些问题目的�Ҏ(gu��)��原因是什么呢�Q�没错，正是JavaScript单线�E�机制导致了�q�些问题。在单线�E�里执行异步通信需要事仉���动程序设计和复杂的语句。如果当�E�序在等待服务器的响应时�Q�有另外一个线�E�可以来处理用户��h���Q�那么上�q�复杂技术就不需要了�?/p>
<h3>试试多线�E�编�E?/h3>
<p>让我来介�l�一下Concurrent.Thread�Q�它是一个允许JavaScript�q�行多线�E�编�E�的库，应用它可以大大缓解上文提�?qi��ng)的在AJAX开发中与异步通信相关的困难。这是一个用JavaScript写成的免费的软�g库，使用它的前提是遵守Mozilla Public License和GNU General Public License�q�两个协议。你可以�?a >他们的网�?</a>下蝲源代码�?/p>
<p>马上来下载和使用源码吧！假定你已�l�将下蝲的源码保存到一个名为Concurrent.Thread.js的文件夹里，在进行�Q何操作之前，先运行如下程序，�q�是一个很���单的功能实现�Q?/p>
<pre><code>&lt;script type="text/javascript" src="Concurrent.Thread.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
Concurrent.Thread.create(function(){
var i = 0;
while ( 1 ) {
document.body.innerHTML += i++ + "&lt;br&gt;";
}
});
&lt;/script&gt;</code></pre>
<p>执行�q�个�E�序���会(x��)��序昄����?开始的数字�Q�它们一个接一个出玎ͼ�你可以滚屏来看它。现在让我们来仔�l�研�I�一下代码，他应用while(1)条�g刉���了一个不�?x��)中止的循环�Q�通常情况下，象这样不断��用一个�ƈ且是唯一一个线�E�的JavaScript�E�序�?x��)导致浏览器看�v来象�ȝ��了一��P��自然也就不会(x��)允许你滚屏。那么�ؓ(f��)什么上面的�q�段�E�序允许你这么做呢？关键之处在于while(1)上面的那条Concurrent.Thread.create()语句�Q�这是这个库提供的一个方法，它可以创��Z��个新�U�程。被当做参数传入的函数在�q�个新线�E�里执行�Q�让我们对程序做如下微调�Q?/p>
<pre><code>&lt;script type="text/javascript" src="Concurrent.Thread.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
function f ( i ){
while ( 1 ) {
document.body.innerHTML += i++ + "&lt;br&gt;";
}
}
Concurrent.Thread.create(f, 0);
Concurrent.Thread.create(f, 100000);
&lt;/script&gt; </code></pre>
<p><span style="font-family: monospace">在这个程序里有个新函数f()可以重复昄���数字�Q�它是在�E�序�D��v始定义的�Q�接着以f()为参数调用了两次create()�Ҏ(gu��)���Q�传�l�create()�Ҏ(gu��)��的第二个参数���会(x��)不加修改��C���l�f()。执行这个程序，先会(x��)看到一些从0开始的���数�Q�接着是一些从100,000开始的大数�Q�然后又是接着前面���数��序的数字。你可以观察到程序在交替昄������数和大敎ͼ��q�说明两个线�E�在同时�q�行�?/span></p>
<p>让我来展�C�Concurrent.Thread的另外一个用法。上面的例子调用create()�Ҏ(gu��)��来创建新�U�程。不调用库里的�Q何APIs也有可能实现�q�个目的。例如，前面那个例子可以�q�样写：(x��)</p>
<pre><code>&lt;script type="text/javascript" src="Concurrent.Thread.js"&gt;&lt;/script&gt;
&lt;script type="text/x-script.multithreaded-js"&gt;
var i = 1;
while ( 1 ) {
document.body.innerHTML += i++ + "&lt;br&gt;";
}
&lt;/script&gt; </code></pre>
<p><span style="font-family: monospace">在script 标签内，很简单地用JavaScript写了一个无�I���@环。你应该注意到标�{�ֆ�的type属性，那里是一个很陌生的�?text/x- script.multithreaded-js)�Q�如果这个属性被攑֜�script标签内，那么Concurrent.Thread��׃��(x��)在一个新的线�E�内执行标签之间的程序。你应当��C��一点，在本例一��P��必须���Concurrent.Thread库包含进来�?/span></p>
<p>有了Concurrent.Thread�Q�就有可能自如的���执行环境在�U�程之间�q�行切换�Q�即使你的程序很�ѝ��连�l�性很强。我们可以简要地讨论下如何执行这�U�操作。简�a�之，需要进行代码�{换。粗略地�Ԍ��首先要把传递给create()的函数�{换成一个字�W�串�Q�接着改写直至它可以被分批分次执行。然后这些程序可以依照调度程序逐步执行。调度程序负责协调多�U�程�Q�换句话��_(d��)��它可以在适当的时候做�����整以便每一个修改后的函数都�?x��)得到同�{�机�?x��)运行�?Concurrent.Thread实际上�ƈ没有创徏新的�U�程�Q�仅仅是在原本单�U�程的基���上模拟了一个多�U�程环境�?/p>
<p>虽然转换后的函数看�v来是�q�行在不同的�U�程内，但是实际上只有一个线�E�在做这所有的事情。在转换后的函数内执行同步通信仍然�?x��)造成���览器冻�l�，你也�怼�(x��)认�ؓ(f��)以前的那些问题根本就没有解决。不�q�你不必耽心�Q�Concurrent.Thread提供了一个应用JavaScript 的异步通信方式实现的定刉���信库，它被设计成当一个线�E�在�{�待服务器的响应时允许其它线�E�运行。这个通信库存�?Concurrent.Thread.Http下。它的用法如下所�C�：(x��)</p>
<pre><code>&lt;script type="text/javascript" src="Concurrent.Thread.js"&gt;&lt;/script&gt;
&lt;script type="text/x-script.multithreaded-js"&gt;
var req = Concurrent.Thread.Http.get(url, ["Accept", "*"]);
if (req.status == 200) {
alert(req.responseText);
} else {
alert(req.statusText);
}
&lt;/script&gt; </code></pre>
<p>get()�Ҏ(gu��)���Q�就像它的名字暗�C�的那样�Q�可以通过HTTP的GET�Ҏ(gu��)��获得指定URL的内容，它将目标URL作�ؓ(f��)�W�一个参敎ͼ����一个代表HTTP��h��头的数组作�ؓ(f��)可选的�W�二个参数。get()�Ҏ(gu��)��与服务器交互�Q�当得到服务器的响应后就�q�回一个XMLHttpRequest对象作�ؓ(f��)�q�回倹{��当get()�Ҏ(gu��)���q�回�Ӟ��已经收到了服务器响应�Q�所以就没必要再用回调函数接收结果。自�?d��ng)���也不必再耽心当程序等待服务器的响应时���览器冻�l�的情况了。另外，�q�有一�?post()�Ҏ(gu��)��可以用来发送数据到服务器：(x��)</p>
<pre><code>&lt;script type="text/javascript" src="Concurrent.Thread.js"&gt;&lt;/script&gt;
&lt;script type="text/x-script.multithreaded-js"&gt;
var req = Concurrent.Thread.Http.post(url, "key1=val1&amp;key2=val2");
alert(req.statusText);
&lt;/script&gt;</code> </pre>
<p>post()�Ҏ(gu��)�����目的URL作�ؓ(f��)�W�一个参敎ͼ�要发送的内容作�ؓ(f��)�W�二个参数。像get()�Ҏ(gu��)��那样�Q�你也可以将��h��头作为可选的�W�三个参数�?/p>
<p>如果你用�q�个通信库实��C���W�一个例子当中的getArticle()�Ҏ(gu��)���Q�那么你很快���p��应用文章开头示例的那种���单的�Ҏ(gu��)��写出getArticleWithCache(),backgroundLoad ()以及(qi��ng)其它调用了getArticle()�Ҏ(gu��)��的函��C��。即使是那版backgroundLoad()正在��L��章数据，照例�q�有另外一个线�E�可以对用户��h��做出响应�Q�浏览器因此也不�?x��)冻�l�。现在，你能理解在JavaScript中应用多�U�程有多实用了？</p>
<h3>想了解更�?/h3>
<p>我向你介�l�了一个可以在JavaScript中应用多�U�程的库�Q�Concurrent.Thread。这���文章的内容只是很初�U�的东西�Q�如果你��x��深入的了解，我推荐�?zh��n)��ȝ�?a >the tutorial</a>。它提供有关Concurrent.Thread用法的更多内容，�q�列��Z��可供高��用户使用的文档，是最适合��h��的材料。访�?a >他们的网�?/a>也不错，那里提供更多信息�?/p>
</div>
</h3><img src ="http://www.tkk7.com/joan/aggbug/232317.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.tkk7.com/joan/" target="_blank">joan</a> 2008-10-04 14:18 <a href="http://www.tkk7.com/joan/articles/232317.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>js正则表达�?/title><link>http://www.tkk7.com/joan/articles/222371.html</link><dc:creator>joan</dc:creator><author>joan</author><pubDate>Fri, 15 Aug 2008 15:40:00 GMT</pubDate><guid>http://www.tkk7.com/joan/articles/222371.html</guid><wfw:comment>http://www.tkk7.com/joan/comments/222371.html</wfw:comment><comments>http://www.tkk7.com/joan/articles/222371.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.tkk7.com/joan/comments/commentRss/222371.html</wfw:commentRss><trackback:ping>http://www.tkk7.com/joan/services/trackbacks/222371.html</trackback:ping><description><![CDATA[<div   id="e8c4myo"   class="lh3" id="veryContent" style="overflow: hidden; width: 100%; height: 2px"></div>
<div   class="6eiwce4"   id="blogContainer" style="font-size: 12px"><img id="paperPicArea0" style="display: none" src="http://imgcache.qq.com/ac/b.gif"  alt="" />&nbsp;<img id="paperPicArea" style="display: none" src="http://imgcache.qq.com/ac/b.gif"  alt="" />//校验是否全由数字�l�成 <br />
[code] function isDigit(s) { var patrn=/^[0-9]{1,20}$/; if (!patrn.exec(s)) return false return true } [/code] <br />
//校验��d��名：(x��)只能输入5-20个以字母开头、可带数字�?#8220;_&#8221;�?#8220;.&#8221;的字�?<br />
[code] function isRegisterUserName(s) { var patrn=/^[a-zA-Z]{1}([a-zA-Z0-9]|[._]){4,19}$/; if (!patrn.exec(s)) return false return true } [/code] <br />
//校验用户姓名�Q�只能输�?-30个以字母开头的字串 <br />
[code] function isTrueName(s) { var patrn=/^[a-zA-Z]{1,30}$/; if (!patrn.exec(s)) return false return true } }} //校验密码�Q�只能输�?-20个字母、数字、下划线 [code] function isPasswd(s) { var patrn=/^(\w){6,20}$/; if (!patrn.exec(s)) return false return true } [/code] <br />
//校验普通电(sh��)话、传真号码：(x��)可以&#8220;+&#8221;开��_(d��)��除数字外�Q�可含有&#8220;-&#8221; <br />
[code] function isTel(s) { //var patrn=/^[+]{0,1}(\d){1,3}[ ]?([-]?(\d){1,12})+$/; var patrn=/^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/; if (!patrn.exec(s)) return false return true } [/code] <br />
//校验手机��L(f��ng)���Q�必���M��数字开��_(d��)��除数字外�Q�可含有&#8220;-&#8221; <br />
[code] function isMobil(s) { var patrn=/^[+]{0,1}(\d){1,3}[ ]?([-]?((\d)|[ ]){1,12})+$/; if (!patrn.exec(s)) return false return true } [/code] <br />
//校验邮政�~�码 <br />
[code] function isPostalCode(s) { //var patrn=/^[a-zA-Z0-9]{3,12}$/; var patrn=/^[a-zA-Z0-9 ]{3,12}$/; if (!patrn.exec(s)) return false return true } [/code] <br />
//校验搜烦关键�?<br />
[code] function isSearch(s) { var patrn=/^[^`~!@#$%^&amp;*()+=|\\\][\]\{\}:;'\,.&lt;&gt;/?]{1}[^`~!@$%^&amp;()+=|\\\] [\]\{\}:;'\,.&lt;&gt;?]{0,19}$/; if (!patrn.exec(s)) return false return true } function isIP(s) //by zergling { var patrn=/^[0-9.]{1,20}$/; if (!patrn.exec(s)) return false return true } [/code] <br />
正则表达�?<br />
[code] "^\\d+$"　　//非负整数�Q�正整数 + 0�Q?"^[0-9]*[1-9][0-9]*$"　　//正整�?"^((-\\d+)|(0+))$"　　//非正整数�Q�负整数 + 0�Q?"^-[0-9]*[1-9][0-9]*$"　　//负整�?"^-?\\d+$"　　　　//整数 "^\\d+(\\.\\d+)?$"　　//非负���点敎ͼ�正��Q�Ҏ(gu��)�� + 0�Q?"^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$"　 //正��Q�Ҏ(gu��)�� "^((-\\d+(\\.\\d+)?)|(0+(\\.0+)?))$"　　//非正���点敎ͼ�负��Q�Ҏ(gu��)�� + 0�Q?"^(-(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*)))$"　 //负��Q�Ҏ(gu��)�� "^(-?\\d+)(\\.\\d+)?$"　　//���点�?"^[A-Za-z]+$"　　//�?6个英文字母组成的字符�?"^[A-Z]+$"　　//�?6个英文字母的大写�l�成的字�W�串 "^[a-z]+$"　　//�?6个英文字母的���写�l�成的字�W�串 "^[A-Za-z0-9]+$"　　//由数字和26个英文字母组成的字符�?"^\\w+$"　　//由数字�?6个英文字母或者下划线�l�成的字�W�串 "^[\\w-]+(\\.[\\w-]+)*@[\\w-]+(\\.[\\w-]+)+$"　　　　//email地址 "^[a-zA-z]+://(\\w+(-\\w+)*)(\\.(\\w+(-\\w+)*))*(\\?\\S*)?$"　　//url "^[A-Za-z0-9_]*$" [/code] <br />
正则表达式��用详�?<br />
����?<br />
���单的��_(d��)��正则表达式是一�U�可以用于模式匹配和替换的强有力的工兗���其作用如下�Q?<br />
���试字符串的某个模式。例如，可以对一个输入字�W�串�q�行���试�Q�看在该字符串是否存在一个电(sh��)话号码模式或一个信用卡��L(f��ng)��模式。这�U�Cؓ(f��)数据有效性验证�?<br />
替换文本。可以在文档中��用一个正则表辑ּ�来标识特定文字，然后可以全部���其删除�Q�或者替换�ؓ(f��)别的文字�?<br />
�Ҏ(gu��)��模式匚w��从字�W�串中提取一个子字符丌Ӏ�可以用来在文本或输入字�D�中查找特定文字�?<br />
基本语法 <br />
在对正则表达式的功能和作用有了初步的了解之后�Q�我们就来具体看一下正则表辑ּ�的语法格式�?<br />
正则表达式的形式一般如下：(x��)　　 <br />
/love/　　其中位于&#8220;/&#8221;定界�W�之间的部分���是���要在目标对象中�q�行匚w��的模式。用户只要把希望查找匚w��对象的模式内�Ҏ(gu��)���?#8220;/&#8221;定界�W�之间即可。�ؓ(f��)了能够��用户更加灉|��的定制模式内容，正则表达式提供了专门�?#8220;元字�W?#8221;。所谓元字符���是指那些在正则表达式中��h���Ҏ(gu��)��意义的专用字�W�，可以用来规定其前导字�W�（即位于元字符前面的字�W�）在目标对象中的出现模式�?<br />
较�ؓ(f��)常用的元字符包括�Q?&#8220;+&#8221;�Q?&#8220;*&#8221;�Q�以�?&#8220;?&#8221;�?<br />
&#8220;+&#8221;元字�W�规定其前导字符必须在目标对象中�q�箋出现一�ơ或多次�?<br />
&#8220;*&#8221;元字�W�规定其前导字符必须在目标对象中出现零次或连�l�多�ơ�?<br />
&#8220;?&#8221;元字�W�规定其前导对象必须在目标对象中�q�箋出现零次或一�ơ�?<br />
下面�Q�就让我们来看一下正则表辑ּ�元字�W�的具体应用�?<br />
/fo+/　　因�ؓ(f��)上述正则表达式中包含&#8220;+&#8221;元字�W�，表示可以与目标对象中�?&#8220;fool&#8221;, &#8220;fo&#8221;, 或�?&#8220;football&#8221;�{�在字母f后面�q�箋出现一个或多个字母o的字�W�串相匹配�?<br />
/eg*/　　因�ؓ(f��)上述正则表达式中包含&#8220;*&#8221;元字�W�，表示可以与目标对象中�?&#8220;easy&#8221;, &#8220;ego&#8221;, 或�?&#8220;egg&#8221;�{�在字母e后面�q�箋出现零个或多个字母g的字�W�串相匹配�?<br />
/Wil?/　　因�ؓ(f��)上述正则表达式中包含&#8220;�Q?#8221;元字�W�，表示可以与目标对象中�?&#8220;Win&#8221;, 或�?#8220;Wilson&#8221;,�{�在字母i后面�q�箋出现零个或一个字母l的字�W�串相匹配�?<br />
有时候不知道要匹配多���字�W�。�ؓ(f��)了能适应�q�种不确定性，正则表达式支持限定符的概��c(di��n)��这些限定符可以指定正则表达式的一个给定组件必��要出现多少�ơ才能满���_��配�?<br />
{n} n 是一个非负整数。匹配确定的 n �ơ。例如，'o{2}' 不能匚w�� "Bob" 中的 'o'�Q�但是能匚w�� "food" 中的两个 o�?<br />
{n,} n 是一个非负整数。至���匹�?n �ơ。例如，'o{2,}' 不能匚w�� "Bob" 中的 'o'�Q�但能匹�?"foooood" 中的所�?o�?o{1,}' �{��h(hu��n)�?'o+'�?o{0,}' 则等价于 'o*'�?<br />
{n,m} m �?n 均�ؓ(f��)非负整数�Q�其中n &lt;= m。最���匹�?n �ơ且最多匹�?m �ơ。例如，"o{1,3}" ���匹�?"fooooood" 中的前三�?o�?o{0,1}' �{��h(hu��n)�?'o?'。请注意在逗号和两个数之间不能有空根{�?<br />
除了元字�W�之外，用户�q�可以精���指定模式在匚w��对象中出现的频率。例如，/jim {2,6}/ 上述正则表达式规定字�W�m可以在匹配对象中�q�箋出现2-6�ơ，因此�Q�上�q�正则表辑ּ�可以同jimmy或jimmmmmy�{�字�W�串相匹配�?<br />
在对如何使用正则表达式有了初步了解之后，我们来看一下其它几个重要的元字�W�的使用方式�?<br />
[code] \s�Q�用于匹配单个空格符�Q�包括tab键和换行�W�； \S�Q�用于匹配除单个�I�格�W�之外的所有字�W�； \d�Q�用于匹配从0�?的数字； \w�Q�用于匹配字母，数字或下划线字符�Q?\W�Q�用于匹配所有与\w不匹配的字符�Q?. �Q�用于匹配除换行�W�之外的所有字�W��?[/code] <br />
�Q�说明：(x��)我们可以把\s和\S以及(qi��ng)\w和\W看作互�ؓ(f��)逆运���） <br />
下面�Q�我们就通过实例看一下如何在正则表达式中使用上述元字�W��?<br />
/\s+/ 上述正则表达式可以用于匹配目标对象中的一个或多个�I�格字符�?<br />
/\d000/　如果我们手中有一份复杂的财务报表�Q�那么我们可以通过上述正则表达式轻而易丄���查找到所有总额辑֍�元的���N���?<br />
除了我们以上所介绍的元字符之外�Q�正则表辑ּ�中还��h��另外一�U�较为独特的专用字符�Q�即定位�W�。定位符用于规定匚w��模式在目标对象中的出��C���|��?较�ؓ(f��)常用的定位符包括�Q?&#8220;^&#8221;, &#8220;$&#8221;, &#8220;\b&#8221; 以及(qi��ng) &#8220;\B&#8221;�?<br />
[code] &#8220;^&#8221;定位�W�规定匹配模式必���d��现在目标字符串的开�?&#8220;$&#8221;定位�W�规定匹配模式必���d��现在目标对象的结��?&#8220;\b&#8221;定位�W�规定匹配模式必���d��现在目标字符串的开头或�l�尾的两个边界之一 &#8220;\B&#8221;定位�W�则规定匚w��对象必须位于目标字符串的开头和�l�尾两个边界之内�Q?卛_��配对象既不能作�ؓ(f��)目标字符串的开��_(d��)��也不能作为目标字�W�串的结����?[/code] <br />
同样�Q�我们也可以�?#8220;^&#8221;�?#8220;$&#8221;以及(qi��ng)&#8220;\b&#8221;�?#8220;\B&#8221;看作是互为逆运���的两组定位�W�。�D例来��_(d��)��(x��) /^hell/　因�ؓ(f��)上述正则表达式中包含&#8220;^&#8221;定位�W�，所以可以与目标对象中以 &#8220;hell&#8221;, &#8220;hello&#8221;�?#8220;hellhound&#8221;开头的字符串相匚w���?/ar$/　因�ؓ(f��)上述正则表达式中包含&#8220;$&#8221;定位�W�，所以可以与目标对象中以 &#8220;car&#8221;, &#8220;bar&#8221;�?&#8220;ar&#8221; �l�尾的字�W�串相匹配�?/\bbom/　因�ؓ(f��)上述正则表达式模式以&#8220;\b&#8221;定位�W�开��_(d��)��所以可以与目标对象中以 &#8220;bomb&#8221;, �?&#8220;bom&#8221;开头的字符串相匚w���?man\b/　因�ؓ(f��)上述正则表达式模式以&#8220;\b&#8221;定位�W�结���，所以可以与目标对象中以 &#8220;human&#8221;, &#8220;woman&#8221;�?&#8220;man&#8221;�l�尾的字�W�串相匹配�?<br />
��Z��能够方便用户更加灉|��的设定匹配模式，正则表达式允�怋�用者在匚w��模式中指定某一个范围而不局限于具体的字�W�。例如：(x��) <br />
[code] /[A-Z]/　　上述正则表达式将�?x��)与从A到Z范围内�Q何一个大写字母相匚w���?/[a-z]/　　上述正则表达式将�?x��)与从a到z范围内�Q何一个小写字母相匚w���?/[0-9]/ 　上述正则表达式将�?x��)与�?�?范围内�Q何一个数字相匚w���?/([a-z][A-Z][0-9])+/　上述正则表达式将�?x��)与��M��由字母和数字�l�成的字�W�串�Q�如 &#8220;aB0&#8221; �{�相匚w���?[/code] <br />
�q�里需要提醒用��h��意的一点就是可以在正则表达式中使用 &#8220;()&#8221; 把字�W�串�l�合在一赗��?#8220;()&#8221;�W�号包含的内容必���d��时出现在目标对象中。因此，上述正则表达式将无法与诸�?&#8220;abc&#8221;�{�的字符串匹配，因�ؓ(f��)&#8220;abc&#8221;中的最后一个字�W��ؓ(f��)字母而非数字�?<br />
如果我们希望在正则表辑ּ�中实现类似编�E�逻辑中的&#8220;�?#8221;�q�算�Q�在多个不同的模式中任选一个进行匹配的话，可以使用���道�W?&#8220;|&#8221;。例如：(x��)/to|too|2/　上述正则表达式将�?x��)与目标对象中�?&#8220;to&#8221;, &#8220;too&#8221;, �?&#8220;2&#8221; 相匹配�?<br />
正则表达式中�q�有一个较为常用的�q�算�W�，卛_��定符 &#8220;[^]&#8221;。与我们前文所介绍的定位符 &#8220;^&#8221; 不同�Q�否定符 &#8220;[^]&#8221;规定目标对象中不能存在模式中所规定的字�W�串。例如：(x��)/[^A-C]/　上述字符串将�?x��)与目标对象中除A�Q�B�Q�和C之外的�Q何字�W�相匚w��。一般来��_(d��)���?#8220;^&#8221;出现�?&#8220;[]&#8221;内时���p��视做否定�q�算�W�；而当&#8220;^&#8221;位于&#8220;[]&#8221;之外�Q�或没有&#8220;[]&#8221;�Ӟ��则应当被视做定位�W��?<br />
最后，当用户需要在正则表达式的模式中加入元字符�Q��ƈ查找其匹配对象时�Q�可以��用�{义符&#8220;\&#8221;。例如：(x��)/Th\*/ 　上述正则表达式将�?x��)与目标对象中�?#8220;Th*&#8221;而非&#8220;The&#8221;�{�相匚w���?<br />
在构造正则表辑ּ�之后�Q�就可以象数学表辑ּ�一��h��求��|��也就是说�Q�可以从左至叛_ƈ按照一个优先���序来求倹{��优先��如下�Q?<br />
[code] 1�Q�\ 转义�W?2�Q?), (?:), (?=), [] 圆括号和�Ҏ(gu��)���?3�Q?, +, ?, {n}, {n,}, {n,m} 限定�W?4�Q�^, $, \anymetacharacter 位置和顺�?5�Q�|&#8220;�?#8221;操作 [/code] <br />
使用实例 <br />
在JavaScript 1.2中带有一个功能强大的RegExp()对象�Q�可以用来进行正则表辑ּ�的匹配操作。其中的test()�Ҏ(gu��)��可以���(g��)验目标对象中是否包含匚w��模式�Q��ƈ相应的返回true或false�?<br />
我们可以使用JavaScript�~�写以下脚本�Q�验证用戯���入的邮�g地址的有效性�?<br />
[code] &lt;html&gt; &lt;head&gt; 　 &lt;script language="Javascript1.2"&gt; 　　　　 &lt;!-- start hiding 　　　　 function verifyAddress(obj) 　　　　　{ 　　　　　　var email = obj.email.value; 　　　　　　var pattern = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/; 　　　　　　flag = pattern.test(email); 　　　　　　if(flag) 　　　　　　{ 　　　　　　　alert(&#8220;Your email address is correct!&#8221;); 　　　　　　　return true; 　　　　　　} 　　　　　　else 　　　　　　　{ 　　　　　　　　alert(&#8220;Please try again!&#8221;); 　　　　　　　　return false; 　　　　　　　 } 　　　　　 } 　　　　 // stop hiding --&gt; 　　　 &lt;/script&gt; 　　&lt;/head&gt; 　 &lt;body&gt; 　　 &lt;form onSubmit="return verifyAddress(this);"&gt; 　　　 &lt;input name="email" type="text"&gt; 　　　 &lt;input type="submit"&gt; 　　　 &lt;/form&gt; 　　&lt;/body&gt; &lt;/html&gt; [/code] <br />
正则表达式对�?<br />
本对象包含正则表辑ּ�模式以及(qi��ng)表明如何应用模式的标志�?<br />
[code] 语法 1 re = /pattern/[flags] 语法 2 re = new RegExp("pattern",["flags"]) [/code] <br />
参数 <br />
re <br />
必选项。将要赋��gؓ(f��)正则表达式模式的变量名�?<br />
Pattern <br />
必选项。要使用的正则表辑ּ�模式。如果��用语�?1�Q�用 "/" 字符分隔模式。如果用语法 2�Q�用引号���模式引��h���?<br />
Flags <br />
可选项。如果��用语�?2 要用引号��?flag 引�v来。标志可以组合��用，可用的有�Q?<br />
[code] g �Q�全文查扑և�现的所�?pattern�Q?i �Q�忽略大���写�Q?m �Q�多行查找） [/code] <br />
�C�Z�� <br />
下面的示例创��Z��个包含正则表辑ּ�模式�?qi��ng)相��x��志的对象(re)�Q�向�(zh��n)�演�C�正则表辑ּ�对象的用法。在本例中，作�ؓ(f��)�l�果的正则表辑ּ�对象又用�?match �Ҏ(gu��)��中：(x��) <br />
[code] function MatchDemo() { var r, re; // 声明变量�?var s = "The rain in Spain falls mainly in the plain"; re = new RegExp("ain","g"); // 创徏正则表达式对象�?r = s.match(re); // 在字�W�串 s 中查扑֌�配�?return(r); } [/code] <br />
�q�回��|��(x��) ain,ain,ain,ain\\ <br />
属�?lastIndex 属�?| source 属性\\ <br />
�Ҏ(gu��)�� compile �Ҏ(gu��)�� | exec �Ҏ(gu��)�� | test �Ҏ(gu��)��\\ <br />
要求 版本 3\\ <br />
请参�?RegExp 对象 | 正则表达式语�?| String 对象\\ <br />
exec �Ҏ(gu��)�� <br />
用正则表辑ּ�模式在字�W�串中运行查找，�q�返回包含该查找�l�果的一个数�l��?<br />
rgExp.exec(str) <br />
参数 <br />
rgExp <br />
必选项。包含正则表辑ּ�模式和可用标志的正则表达式对象�?<br />
str <br />
必选项。要在其中执行查扄��� String 对象或字�W�串文字�?<br />
说明\\ <br />
如果 exec �Ҏ(gu��)��没有扑ֈ�匚w���Q�则它返�?null。如果它扑ֈ�匚w���Q�则 exec �Ҏ(gu��)���q�回一个数�l�，�q�且更新全局 RegExp 对象的属性，以反映匹配结果。数�l�的0元素包含了完整的匚w���Q�而第1到n元素中包含的是匹配中出现的�Q意一个子匚w��。这相当于没有设�|�全局标志 (g) �?match �Ҏ(gu��)���?<br />
如果为正则表辑ּ�讄���了全局标志�Q�exec 从以 lastIndex 的值指�C�的位置开始查找。如果没有设�|�全局标志�Q�exec 忽略 lastIndex 的��|��从字�W�串的�v始位�|�开始搜索�?<br />
exec �Ҏ(gu��)���q�回的数�l�有三个属性，分别�?input、index �?lastIndex。Input 属性包含了整个被查扄���字符丌Ӏ�Index 属性中包含了整个被查找字符串中被匹配的子字�W�串的位�|�。LastIndex 属性中包含了匹配中最后一个字�W�的下一个位�|��?<br />
�C�Z��\\ <br />
下面的例子�D例说明了 exec �Ҏ(gu��)��的用法：(x��) <br />
[code] function RegExpTest() { var ver = Number(ScriptEngineMajorVersion() + "." + ScriptEngineMinorVersion()) if (ver &gt;= 5.5){ // ���试 JScript 的版本�?var src = "The rain in Spain falls mainly in the plain."; var re = /\w+/g; // 创徏正则表达式模式�?var arr; while ((arr = re.exec(src)) != null) document.write(arr.index + "-" + arr.lastIndex + arr + "\t"); } else{ alert("请���?JScript 的更新版�?); } } [/code] <br />
�q�回��|��(x��)0-3The 4-8rain 9-11in 12-17Spain 18-23falls 24-30mainly 31-33in 34-37the 38-43plain <br />
test �Ҏ(gu��)��\\ <br />
�q�回一�?Boolean ��|��它指出在被查扄���字符串中是否存在模式�?<br />
rgexp.test(str) <br />
参数\\ <br />
rgexp <br />
必选项。包含正则表辑ּ�模式或可用标志的正则表达式对象�?<br />
str <br />
必选项。要在其上测试查扄���字符丌Ӏ?<br />
说明 <br />
test �Ҏ(gu��)�����(g��)查在字符串中是否存在一个模式，如果存在则返�?true�Q�否则就�q�回 false�?<br />
全局 RegExp 对象的属性不�?test �Ҏ(gu��)��来修攏V�?<br />
�C�Z�� <br />
下面的例子�D例说明了 test �Ҏ(gu��)��的用法：(x��) <br />
[code] function TestDemo(re, s) { var s1; // 声明变量�?// ���(g��)查字�W�串是否存在正则表达式�?if (re.test(s)) // ���试是否存在�?s1 = " contains "; // s 包含模式�?else s1 = " does not contain "; // s 不包含模式�?return("'" + s + "'" + s1 + "'"+ re.source + "'"); // �q�回字符丌Ӏ?} [/code] <br />
函数调用�Q�document.write (TestDemo(/ain+/ ,"The rain in Spain falls mainly in the plain.")); <br />
�q�回��|��(x��)'The rain in Spain falls mainly in the plain.' contains 'ain+' <br />
match �Ҏ(gu��)�� <br />
使用正则表达式模式对字符串执行查找，�q�将包含查找的结果作为数�l�返回。\\ <br />
stringObj.match(rgExp) <br />
参数\\ <br />
stringObj <br />
必选项。对其进行查扄��� String 对象或字�W�串文字�?<br />
rgExp <br />
必选项。�ؓ(f��)包含正则表达式模式和可用标志的正则表辑ּ�对象。也可以是包含正则表辑ּ�模式和可用标志的变量名或字符串文字�?<br />
说明\\ <br />
如果 match �Ҏ(gu��)��没有扑ֈ�匚w���Q�返�?null。如果找到匹配返回一个数�l��ƈ且更新全局 RegExp 对象的属性以反映匚w���l�果�?<br />
match �Ҏ(gu��)���q�回的数�l�有三个属性：(x��)input、index �?lastIndex。Input 属性包含整个的被查扑֭��W�串。Index 属性包含了在整个被查找字符串中匚w��的子字符串的位置。LastIndex 属性包含了最后一�ơ匹配中最后一个字�W�的下一个位�|��?<br />
如果没有讄���全局标志 (g)�Q�数�l�的 0 元素包含整个匚w���Q�而第 1 �?n 元素包含了匹配中曑և�现过的�Q一个子匚w��。这相当于没有设�|�全局标志�?exec �Ҏ(gu��)��。如果设�|�了全局标志�Q�元�?0 �?n 中包含所有匹配�?<br />
�C�Z��\\ <br />
下面的示例演�C�Z��match �Ҏ(gu��)��的用法：(x��) <br />
[code] function MatchDemo() { var r, re; // 声明变量�?var s = "The rain in Spain falls mainly in the plain"; re = /ain/i; // 创徏正则表达式模式�?r = s.match(re); // ���试匚w��搜烦字符丌Ӏ?return(r); // �q�回�W�一�ơ出�?"ain" 的地斏V�?} [/code] <br />
�q�回��|��(x��)ain <br />
本示例说明带 g 标志讄����?match �Ҏ(gu��)��的用法�?<br />
[code] function MatchDemo() { var r, re; // 声明变量�?var s = "The rain in Spain falls mainly in the plain"; re = /ain/ig; // 创徏正则表达式模式�?r = s.match(re); // ���试��d��配搜索字�W�串�?return(r); // �q�回的数�l�包含了所�?"ain" // 出现的四个匹配�?} [/code] <br />
�q�回��|��(x��)ain,ain,ain,ain <br />
上面几行代码演示了字�W�串文字�?match �Ҏ(gu��)��的用法�?<br />
[code] var r, re = "Spain"; r = "The rain in Spain".replace(re, "Canada"); return r; [/code] <br />
�q�回��|��(x��)The rain in Canada <br />
search �Ҏ(gu��)�� <br />
�q�回与正则表辑ּ�查找内容匚w��的第一个子字符串的位置�?<br />
stringObj.search(rgExp) <br />
参数\\ <br />
stringObj <br />
必选项。要在其上进行查扄��� String 对象或字�W�串文字�?<br />
rgExp <br />
必选项。包含正则表辑ּ�模式和可用标志的正则表达式对象�?<br />
说明 <br />
search �Ҏ(gu��)��指明是否存在相应的匹配。如果找��C��个匹配，search �Ҏ(gu��)�����返回一个整数��|��指明�q�个匚w��距离字符串开始的偏移位置。如果没有找到匹配，则返�?-1�?<br />
�C�Z��\\ <br />
下面的示例演�C�Z�� search �Ҏ(gu��)��的用法�?<br />
[code] function SearchDemo() { var r, re; // 声明变量�?var s = "The rain in Spain falls mainly in the plain."; re = /falls/i; // 创徏正则表达式模式�?r = s.search(re); // 查找字符丌Ӏ?return(r); // �q�回 Boolean �l�果�?} [/code] <br />
�q�回��|��(x��)18</div>
<img src ="http://www.tkk7.com/joan/aggbug/222371.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.tkk7.com/joan/" target="_blank">joan</a> 2008-08-15 23:40 <a href="http://www.tkk7.com/joan/articles/222371.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss>                                                                                                                                                                                                                                                                          <footer>
<div class="friendship-link">
<p>��л���������ǵ���վ�������ܻ���������Դ����Ȥ��</p>
<a href="http://www.tkk7.com/" title="&#20122;&#27954;&#97;&#118;&#25104;&#20154;&#29255;&#22312;&#32447;&#35266;&#30475;">&#20122;&#27954;&#97;&#118;&#25104;&#20154;&#29255;&#22312;&#32447;&#35266;&#30475;</a>

<div class="friend-links">


</div>
</div>

</footer>

��վ֩���ģ�壺
<a href="http://microston.com" target="_blank">���޹����ۺϾ�Ʒ</a>|
<a href="http://wwwee2.com" target="_blank">����������ҹ��Ʒ�����Ƶ</a>|
<a href="http://z88d.com" target="_blank">����AV���������鶹��Ʒ����</a>|
<a href="http://xsdjiagu.com" target="_blank">�����˳�������WWW</a>|
<a href="http://43sihu.com" target="_blank">���߹ۿ��˳���վ��ҹ���</a>|
<a href="http://xbooktxt.com" target="_blank">��ŷ���һ��ëƬ</a>|
<a href="http://116603a.com" target="_blank">�ž��Ⱦþ������Ƶ</a>|
<a href="http://wenfaka.com" target="_blank">AV�����������˵����ù���</a>|
<a href="http://jomashopcn.com" target="_blank">������Ƶһ�����߹ۿ�</a>|
<a href="http://86trader.com" target="_blank">������JIZZ�ձ���</a>|
<a href="http://jsky163.com" target="_blank">���޹�����Ʒ����AV����þ��ۺ�ӰԺ</a>|
<a href="http://732r.com" target="_blank">����Ұ����������߹ۿ�</a>|
<a href="http://998wc.com" target="_blank">����Ұ�������һ����Ƶ
</a>|
<a href="http://wwwks2424.com" target="_blank">��ҹA��ëƬ��Ƶ���</a>|
<a href="http://czxgjt.com" target="_blank">97�þù������޾�Ʒ������</a>|
<a href="http://bobostrong31.com" target="_blank">����v�������۵�Ӱ</a>|
<a href="http://xbooktxt.com" target="_blank">���޾�Ʒ��������������Ļ</a>|
<a href="http://haigoumama.com" target="_blank">�ձ�һ�����������</a>|
<a href="http://hh5151.com" target="_blank">24Сʱ�ձ�����www��ѵ�</a>|
<a href="http://gisdn.com" target="_blank">�鶹������Ʒ�����Ƶ</a>|
<a href="http://sh-shule.com" target="_blank">�þ�99��Ʒ����ѿ�</a>|
<a href="http://142121.com" target="_blank">����˳���վ���߹ۿ�����</a>|
<a href="http://jgxsdst.com" target="_blank">�þó���������Ѳ���</a>|
<a href="http://www-456446.com" target="_blank">������Ƶ�������</a>|
<a href="http://dstbxg.com" target="_blank">����������Ӱһ��������������Ѿþþþþþþ�
</a>|
<a href="http://www-554757.com" target="_blank">����ͼƬ����У԰С˵��</a>|
<a href="http://sdzhly.com" target="_blank">����������Ļ��Ʒ�þ�</a>|
<a href="http://bdyls.com" target="_blank">����һ�����������þ�</a>|
<a href="http://hqshimo.com" target="_blank">���޹���ģ�����߲���</a>|
<a href="http://266hd.com" target="_blank">��������ŵ�����</a>|
<a href="http://maomi02.com" target="_blank">���޹�������������Ƶ</a>|
<a href="http://bj-tkld.com" target="_blank">����ëƬ�����Ƶ</a>|
<a href="http://yu388.com" target="_blank">����һ����Ʒ��Ƶ����</a>|
<a href="http://cqtchtwq.com" target="_blank">����������Ļ��������һ������
</a>|
<a href="http://huakangweicai.com" target="_blank">����Ƭ���߹ۿ����</a>|
<a href="http://www-34595.com" target="_blank">������߹�Ӱ��վ</a>|
<a href="http://66661660.com" target="_blank">�պ���Ӱ������߹ۿ���վ
</a>|
<a href="http://jomashopcn.com" target="_blank">��������һ��������������</a>|
<a href="http://www2626cf.com" target="_blank">�ձ����޳ɸ���һ����������
</a>|
<a href="http://schygfz.com" target="_blank">�þþþþù�����Ʒ��������ͬ
</a>|
<a href="http://xf002.com" target="_blank">�պ������������ëƬ</a>|
<script>
(function(){
    var bp = document.createElement('script');
    var curProtocol = window.location.protocol.split(':')[0];
    if (curProtocol === 'https') {
        bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
    }
    else {
        bp.src = 'http://push.zhanzhang.baidu.com/push.js';
    }
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(bp, s);
})();
</script>
</body>