﻿<?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>BlogJava-joan-文章分类-js</title><link>http://www.blogjava.net/joan/category/33809.html</link><description>私は张で

</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.blogjava.net/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.blogjava.net/joan/articles/307918.html</guid><wfw:comment>http://www.blogjava.net/joan/comments/307918.html</wfw:comment><comments>http://www.blogjava.net/joan/articles/307918.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/joan/comments/commentRss/307918.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/joan/services/trackbacks/307918.html</trackback:ping><description><![CDATA[<h2>概述<a href="http://images.cnblogs.com/cnblogs_com/Terrylee/WindowsLiveWriter/240jQuery_128F5/jquery_2.gif"></a></h2>
<p>jQuery 是继 prototype 之后又一个优秀的 Javascript 框架。其宗旨是—写更少的代码,做更多的事情。它是轻量级的 js 库(压缩后只有21k) ，这是其它的 js 库所不<a href="http://images.cnblogs.com/cnblogs_com/Terrylee/WindowsLiveWriter/240jQuery_128F5/jquery_2.gif"></a>及的，它兼容 CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）。 jQuery 是一个快速的，简洁的 javaScript 库，使用户能更方便地处理 HTML documents、events、实现动画效果，并且方便地为网站提供 AJAX 交互。 jQuery 还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。 jQuery 能够使用户的 html 页保持代码和 html 内容分离，也就是说，不用再在 html 里面插入一堆js来调用命令了，只需定义 id 即可。今天在<a title="Logo Kollermedia.at" href="http://www.kollermedia.at/">Kollermedia.at</a>上发现了一篇JQuery插件列表的<a href="http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/" target="_blank">文章</a>，特推荐如下。</p>
<h2>文件上传(File upload)<a href="http://images.cnblogs.com/cnblogs_com/Terrylee/WindowsLiveWriter/240jQuery_128F5/JQuery_001_6.gif"></a></h2>
<p><a href="http://www.phpletter.com/Demo/AjaxFileUpload-Demo/">Ajax File Upload</a>.<br />
<a href="http://www.pixeline.be/experiments/jqUploader/">jQUploader</a>.<br />
<a href="http://www.fyneworks.com/jquery/multiple-file-upload/">Multiple File Upload plugin</a>.&nbsp; <br />
<a href="http://www.appelsiini.net/projects/filestyle">jQuery File Style</a>.<br />
<a href="http://jquery.com/plugins/project/InputFileCSS">Styling an input type file</a>.<br />
<a href="http://digitalbush.com/projects/progress-bar-plugin">Progress Bar Plugin</a>. </p>
<h2>表单验证(Form Validation)</h2>
<p><a href="http://bassistance.de/jquery-plugins/jquery-plugin-validation/">jQuery Validation</a>.<br />
<a href="http://www.dyve.net/jquery/?autohelp">Auto Help</a>.<br />
<a href="http://www.willjessup.com/sandbox/jquery/form_validator/form_validate.html">Simple jQuery form validation</a>.<br />
<a href="http://letmehaveblog.blogspot.com/2007/08/easy-client-side-web-forms-validations.html">jQuery XAV - form validations</a>.<br />
<a href="http://itgroup.com.ph/alphanumeric/">jQuery AlphaNumeric</a>.<br />
<a href="http://digitalbush.com/projects/masked-input-plugin">Masked Input</a>.<br />
<a href="http://www.dennydotnet.com/post/TypeWatch-jQuery-Plugin.aspx">TypeWatch Plugin</a>.<br />
<a href="http://jquery.com/plugins/project/TextLimiter">Text limiter for form fields</a>.<br />
<a href="http://www.shawngo.com/gafyd/index.html">Ajax Username Check with jQuery</a>.
<h2>表单－选取框(Form - Select Box stuff)</h2>
<p><a href="http://jquery.sanchezsalvador.com/page/jquerycombobox.aspx">jQuery Combobox</a>.<br />
<a href="http://www.ajaxray.com/blog/2007/11/08/jquery-controlled-dependent-or-cascading-select-list-2/">jQuery controlled dependent (or Cascadign) Select List</a>.<br />
<a href="http://code.google.com/p/jqmultiselects/">Multiple Selects</a>.<br />
<a href="http://www.texotela.co.uk/code/jquery/select/">Select box manipulation</a>.<br />
<a href="http://code.google.com/p/jqueryselectcombo/">Select Combo Plugin</a>.<br />
<a href="http://www.msxhost.com/jquery/linked-selects/json/%20target=">jQuery - LinkedSelect</a><br />
<a href="http://remysharp.com/2007/09/18/auto-populate-multiple-select-boxes/">Auto-populate multiple select boxes</a>.<br />
<a href="http://www.sitespotting.it/esempi/002/">Choose Plugin (Select Replacement)</a>.
<h2>表单基本、输入框、选择框等(Form Basics, Input Fields, Checkboxes etc.)</h2>
<p><a href="http://www.malsup.com/jquery/form/">jQuery Form Plugin</a>.<br />
<a href="http://code.handlino.com/wiki/jquery-form">jQuery-Form</a>.<br />
<a href="http://envero.org/jlook/">jLook Nice Forms</a>.<br />
<a href="http://www.whitespace-creative.com/jquery/jNice/">jNice</a>.<br />
<a href="http://www.brainfault.com/2007/07/07/pin-plugin-reloaded/">Ping Plugin</a>.<br />
<a href="http://grzegorz.frydrychowicz.net/jquery_toggleformtext/">Toggle Form Text</a>.<br />
<a href="http://thoughts.kuzemchak.net/entry/toggleval-for-jquery/">ToggleVal</a>.<br />
<a href="http://www.pengoworks.com/workshop/jquery/field.plugin.htm">jQuery Field Plugin</a>.<br />
<a href="http://code.befruit.com/">jQuery Form&#8217;n Field plugin</a>.<br />
<a href="http://www.texotela.co.uk/code/jquery/checkboxes/">jQuery Checkbox manipulation</a>.<br />
<a href="http://www.alcoholwang.cn/jquery/jTaggingDemo.htm">jTagging</a>.<br />
<a href="http://code.google.com/p/labelcheck/">jQuery labelcheck</a>.<br />
<a href="http://scott.sauyet.com/thoughts/archives/2007/03/31/overlabel-with-jquery/">Overlabel</a>.<br />
<a href="http://blog.amicoimmaginario.it/2007/08/28/jquery-plugin-3-state-radio-buttons/">3 state radio buttons</a>.<br />
<a href="http://sanisoft-demo.com/jquery/plugins/shiftcheckbox/">ShiftCheckbox jQuery Plugin</a>.<br />
<a href="http://digitalbush.com/projects/watermark-input-plugin">Watermark Input</a>.<br />
<a href="http://kawika.org/jquery/checkbox/">jQuery Checkbox (checkboxes with imags)</a>.<br />
<a href="http://www.softwareunity.com/sandbox/jqueryspinbtn/">jQuery SpinButton Control</a>.<br />
<a href="http://www.phpletter.com/form_builder/demo.html">jQuery Ajax Form Builder</a>.<br />
<a href="http://www.texotela.co.uk/code/jquery/focusfields/">jQuery Focus Fields</a>.<br />
<a href="http://home.iprimus.com.au/kbwood/jquery/timeEntry.html">jQuery Time Entry</a>.
<h2>时间、日期和颜色选取(Time, Date and Color Picker)</h2>
<p><a href="http://marcgrabanski.com/code/ui-datepicker/">jQuery UI Datepicker</a>.<br />
<a href="http://kelvinluck.com/assets/jquery/datePicker/">jQuery date picker plugin</a>.<br />
<a href="http://code.google.com/p/jquery-timepicker/">jQuery Time Picker</a>.<br />
<a href="http://www.texotela.co.uk/code/jquery/timepicker/">Time Picker</a>.<br />
<a href="http://www.oakcitygraphics.com/jquery/clockpick/ClockPick.cfm">ClickPick</a>.<br />
<a href="http://labs.perifer.se/timedatepicker/">TimePicker</a>.<br />
<a href="http://acko.net/dev/farbtastic">Farbtastic jQuery Color Picker Plugin</a>.<br />
<a href="http://www.intelliance.fr/jquery/color_picker/">Color Picker by intelliance.fr</a>.
<h2>投票插件(Rating Plugins)</h2>
<p><a href="http://www.phpletter.com/Demo/Jquery-Star-Rating-Plugin/#">jQuery Star Rating Plugin</a>.<br />
<a href="http://www.m3nt0r.de/devel/raterDemo/">jQuery Star Rater</a>.<br />
<a href="http://riderdesign.com/articles/displayarticle.aspx?articleid=21">Content rater with asp.net, ajax and jQuery</a>.<br />
<a href="http://www.learningjquery.com/2007/05/half-star-rating-plugin">Half-Star Rating Plugin</a>.
<h2>搜索插件(Search Plugins)</h2>
<p><a href="http://www.vulgarisoip.com/2007/08/06/jquerysuggest-11/">jQuery Suggest</a>.<br />
<a href="http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/">jQuery Autocomplete</a>.<br />
<a href="http://www.pengoworks.com/workshop/jquery/autocomplete.htm">jQuery Autocomplete Mod</a>.<br />
<a href="http://www.ajaxdaddy.com/demo-jquery-autocomplete.html">jQuery Autocomplete by AjaxDaddy</a>.<br />
<a href="http://dev.reach1to1.net/saurabh/jplugins/autocomplete/">jQuery Autocomplete Plugin with HTML formatting</a>.<br />
<a href="http://interface.eyecon.ro/docs/autocomplete">jQuery Autocompleter</a>.<br />
<a href="http://nodstrum.com/2007/09/19/autocompleter/">AutoCompleter (Tutorial with PHP&amp;MySQL)</a>.<br />
<a href="http://rikrikrik.com/jquery/quicksearch/">quick Search jQuery Plugin</a>.
<h2>编辑器(Inline Edit &amp; Editors)<a href="http://images.cnblogs.com/cnblogs_com/Terrylee/WindowsLiveWriter/240jQuery_128F5/JQuery_002_2.gif"></a></h2>
<p><a href="http://www.jaysalvat.com/jquery/jtageditor/">jTagEditor</a>.<br />
<a href="http://demo.wymeditor.org/demo.html">WYMeditor</a>.<br />
<a href="http://garage.pimentech.net/scripts_doc_jquery_jframe/">jQuery jFrame</a>.<br />
<a href="http://www.appelsiini.net/projects/jeditable">Jeditable - edit in place plugin for jQuery</a>. <br />
<a href="http://www.dyve.net/jquery/?editable">jQuery editable</a>.<br />
<a href="http://www.jdempster.com/category/jquery/disableTextSelect/">jQuery Disable Text Select Plugin</a>.<br />
<a href="http://15daysofjquery.com/edit-in-place-with-ajax-using-jquery-javascript-library/15/">Edit in Place with Ajax using jQuery</a>.<br />
<a href="http://davehauenstein.com/blog/archives/28">jQuery Plugin - Another In-Place Editor</a>.<br />
<a href="http://dev.iceburg.net/jquery/tableEditor/demo.php">TableEditor</a>.<br />
<a href="http://joshhundley.com/teditable-in-place-editing-for-tables/">tEditable - in place table editing for jQuery</a>.
<h2>多媒体、视频、Flash等(Audio, Video, Flash, SVG, etc)</h2>
<p><a href="http://www.contentwithstructure.com/extras/jmedia">jMedia - accessible multi-media embedding</a>.<br />
<a href="http://sourceforge.net/projects/jbedit/">JBEdit - Ajax online Video Editor</a>.<br />
<a href="http://www.sean-o.com/jquery/jmp3/">jQuery MP3 Plugin</a>.<br />
<a href="http://malsup.com/jquery/media/">jQuery Media Plugin</a>.<br />
<a href="http://jquery.lukelutman.com/plugins/flash/index.html">jQuery Flash Plugin</a>.<br />
<a href="http://www.solitude.dk/archives/embedquicktime/">Embed QuickTime</a>.<br />
<a href="http://keith-wood.name/svg.html">SVG Integration</a>.
<h2>图片(Photos/Images/Galleries)</h2>
<p><a href="http://jquery.com/demo/thickbox/">ThickBox</a>.<br />
<a href="http://leandrovieira.com/projects/jquery/lightbox/">jQuery lightBox plugin</a>.<br />
<a href="http://blog.joshuaeichorn.com/archives/2007/01/11/jquery-image-strip/">jQuery Image Strip</a>.<br />
<a href="http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/imageslide-plugin.html">jQuery slideViewer</a>.<br />
<a href="http://benjaminsterling.com/2007/09/09/jquery-jqgalscroll-photo-gallery/">jQuery jqGalScroll 2.0</a>.<br />
<a href="http://benjaminsterling.com/2007/10/02/jquery-jqgalviewii-photo-gallery/">jQuery - jqGalViewII</a>.<br />
<a href="http://benjaminsterling.com/2007/10/21/jqgalviewiii-proof-of-concept/">jQuery - jqGalViewIII</a>.<br />
<a href="http://opiefoto.com/articles/photoslider">jQuery Photo Slider</a>.<br />
<a href="http://joanpiedra.com/jquery/thumbs/">jQuery Thumbs - easily create thumbnails</a>.<br />
<a href="http://www.texotela.co.uk/code/jquery/jQIR/">jQuery jQIR Image Replacement</a>.<br />
<a href="http://www.gmarwaha.com/jquery/jcarousellite/index.php#what">jCarousel Lite</a>.<br />
<a href="http://projects.sevir.org/storage/jpanview/index.html">jQPanView</a>.<br />
<a href="http://sorgalla.com/projects/jcarousel/#Examples">jCarousel</a>.<br />
<a href="http://www.intelliance.fr/jquery/imagebox/">Interface Imagebox</a>.<br />
<a href="http://www.getintothis.com/blog/2006/10/12/image-gallery-using-jquery-interface-reflections/">Image Gallery using jQuery, Interface &amp; Reflactions</a>.<br />
<a href="http://realazy.org/lab/jquery/j-gallery/">simple jQuery Gallery</a>.<br />
<a href="http://chicagosocial.com/gallery/">jQuery Gallery Module</a>.<br />
<a href="http://www.eogallery.com/">EO Gallery</a>.<br />
<a href="http://flesler.blogspot.com/search/label/jQuery.ScrollShow">jQuery ScrollShow</a>.<br />
<a href="http://www.malsup.com/jquery/cycle/">jQuery Cycle Plugin</a>.<br />
<a href="http://www.projectatomic.com/en/flickr.htm">jQuery Flickr</a>.<br />
<a href="http://www.appelsiini.net/2007/9/lazy-load-images-jquery-plugin">jQuery Lazy Load Images Plugin</a>.<br />
<a href="http://www.sunsean.com/zoomi/">Zoomi - Zoomable Thumbnails</a>.<br />
<a href="http://remysharp.com/2007/03/19/a-few-more-jquery-plugins-crop-labelover-and-pluck/#crop">jQuery Crop - crop any image on the fly</a>.<br />
<a href="http://jquery.com/plugins/project/reflection">Image Reflection</a>.
<h2>Google地图（Google Map）</h2>
<p><a href="http://www.dyve.net/jquery/?googlemaps">jQuery Plugin googlemaps</a>.<br />
<a href="http://code.google.com/p/jmaps/">jMaps jQuery Maps Framework</a>.<br />
<a href="http://projects.sevir.org/storage/jqmaps/index.html">jQmaps</a>.<br />
<a href="http://olbertz.de/jquery/googlemap.html#">jQuery &amp; Google Maps</a>.<br />
<a href="http://snippets.dzone.com/posts/show/4361">jQuery Maps Interface forr Google and Yahoo maps</a>.<br />
<a href="http://webrocket.ulmb.com/jmaps/">jQuery J Maps - by Tane Piper</a>.
<h2>游戏(Games)</h2>
<p><a href="http://fmarcia.info/jquery/tetris/tetris.html">Tetris with jQuery</a>.<br />
<a href="http://64squar.es/">jQuery Chess</a>.<br />
<a href="http://www.bennadel.com/blog/623-jQuery-Demo-Mad-Libs-Word-Game.htm">Mad Libs Word Game</a>.<br />
<a href="http://www.alexatnet.com/node/68">jQuery Puzzle</a>.<br />
<a href="http://www.willjessup.com/sandbox/jquery/solar_system/rotator.html">jQuery Solar System (not a game but awesome jQuery Stuff)</a>.
<h2>表格等(Tables, Grids etc.)</h2>
<p><a href="http://docs.jquery.com/Plugins/Tablesorter">UI/Tablesorter</a>.<a href="http://images.cnblogs.com/cnblogs_com/Terrylee/WindowsLiveWriter/240jQuery_128F5/JQuery_003_2.gif"><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 href="http://www.reconstrukt.com/ingrid/">jQuery ingrid</a>.<br />
<a href="http://www.trirand.com/blog/?p=13">jQuery Grid Plugin</a>.<br />
<a href="http://ideamill.synaptrixgroup.com/jquery/tablefilter/tabletest.htm">Table Filter - awesome!</a>.<br />
<a href="http://dev.iceburg.net/jquery/tableEditor/demo.php">TableEditor</a>.<br />
<a href="http://www.hanpau.com/jquery/unobtrusivetreetable.php">jQuery Tree Tables</a>.<br />
<a href="http://www.javascripttoolbox.com/jquery/#expandablerows">Expandable &#8220;Detail&#8221; Table Rows</a>.<br />
<a href="http://www.remotesynthesis.com/blog/index.cfm/2007/9/25/Sortable-Table-ColdFusion-Custom-Tag-with-jQueryUI">Sortable Table ColdFusion Costum Tag with jQuery UI</a>.<br />
<a href="http://flesler.blogspot.com/2007/10/jquerybubble.html">jQuery Bubble</a>.<br />
<a href="http://tablesorter.com/docs/">TableSorter</a>.<br />
<a href="http://www.webtoolkit.info/demo/jquery/scrollable/demo.html">Scrollable HTML Table</a>.<br />
<a href="http://p.sohei.org/stuff/jquery/columnmanager/demo/demo.html">jQuery column Manager Plugin</a>.<br />
<a href="http://p.sohei.org/stuff/jquery/tablehover/demo/demo.html">jQuery tableHover Plugin</a>.<br />
<a href="http://p.sohei.org/stuff/jquery/columnhover/demo/demo.html">jQuery columnHover Plugin</a>.<br />
<a href="http://makoomba.altervista.org/grid/">jQuery Grid</a>.<br />
<a href="http://motherrussia.polyester.se/jquery-plugins/tablesorter/">TableSorter plugin for jQuery</a>.<br />
<a href="http://joshhundley.com/teditable-in-place-editing-for-tables/">tEditable - in place table editing for jQuery</a>.<br />
<a href="http://www.hovinne.com/dev/jquery/chartotable/">jQuery charToTable Plugin</a>.<br />
<a href="http://www.ita.es/jquery/jquery.grid.columnSizing.htm">jQuery Grid Column Sizing</a>.<br />
<a href="http://www.ita.es/jquery/jquery.grid.rowSizing.htm">jQuery Grid Row Sizing</a>.
<h2>统计图(Charts, Presentation etc.)</h2>
<p><a href="http://worcesterwideweb.com/2007/06/04/jquery-wizard-plugin/">jQuery Wizard Plugin </a>.<br />
<a href="http://www.reach1to1.com/sandbox/jquery/jqchart/">jQuery Chart Plugin</a>.<br />
<a href="http://ejohn.org/apps/speed/">Bar Chart</a>.
<h2>边框、圆角、背景(Border, Corners, Background)</h2>
<p><a href="http://www.malsup.com/jquery/corner/">jQuery Corner</a>.<br />
<a href="http://blue-anvil.com/archives/anti-aliased-rounded-corners-with-jquery">jQuery Curvy Corner</a>.<br />
<a href="http://dev.jquery.com/%7Epaul/plugins/nifty/example.html">Nifty jQuery Corner</a>.<br />
<a href="http://illandril.net/jQuery/transparentCorners/">Transparent Corners</a>.<br />
<a href="http://www.methvin.com/jquery/jq-corner.html">jQuery Corner Gallery</a>.<br />
<a href="http://blog.brandonaaron.net/my-jquery-plugins/gradient/">Gradient Plugin</a>.
<h2>文字和超链接(Text and Links)</h2>
<p><a href="http://wanderinghorse.net/computing/javascript/jquery/spoilers/demo.html">jQuery Spoiler plugin</a>.<br />
<a href="http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html">Text Highlighting</a>.<br />
<a href="http://www.jdempster.com/category/jquery/disableTextSelect/">Disable Text Select Plugin</a>.<br />
<a href="http://www.texotela.co.uk/code/jquery/newsticker/">jQuery Newsticker</a>.<br />
<a href="http://www.ollicle.com/2007/jun/03/jquery_lineheight_flexible.html">Auto line-height Plugin</a>.<br />
<a href="http://agencenp.net/textgrad/textgrad.html">Textgrad - a text gradient plugin</a>.<br />
<a href="http://kawika.org/jquery/linklook/">LinkLook - a link thumbnail preview</a>.<br />
<a href="http://rikrikrik.com/jquery/pager/#examples">pager jQuery Plugin</a>.<br />
<a href="http://rikrikrik.com/jquery/shortkeys/">shortKeys jQuery Plugin</a>.<br />
<a href="http://www.ollicle.com/eg/jquery/biggerlink">jQuery Biggerlink</a>.<br />
<a href="http://troy.dyle.net/linkchecker/">jQuery Ajax Link Checker</a>.
<h2>鼠标提示（Tooltips）</h2>
<p><a href="http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/">jQuery Plugin - Tooltip</a>.<br />
<a href="http://www.codylindley.com/blogstuff/js/jtip/">jTip - The jQuery Tool Tip</a>.<br />
<a href="http://examples.learningjquery.com/62/demo/index.html#examplesection">clueTip</a>.<br />
<a href="http://edgarverle.com/BetterTip/default.cfm">BetterTip</a>.<br />
<a href="http://ioreader.com/2007/05/15/flash-tooltips-using-jquery/">Flash Tooltips using jQuery</a>.<br />
<a href="http://www.texotela.co.uk/code/jquery/tooltipdemo/">ToolTip</a>.
<h2>菜单和导航(Menus, Navigations)</h2>
<p><a href="http://stilbuero.de/jquery/tabs_3/">jQuery Tabs Plugin - awesome! </a>. [<a href="http://stilbuero.de/jquery/tabs_3/nested.html">demo nested tabs</a>.]<br />
<a href="http://blog.cutterscrossing.com/index.cfm/2007/6/15/Updated-JQuery-Nested-Tab-Set-with-Demo">another jQuery nested Tab Set example (based on jQuery Tabs Plugin)</a>.<br />
<a href="http://www.sunsean.com/idTabs/">jQuery idTabs</a>.<br />
<a href="http://jdsharp.us/jQuery/plugins/jdMenu/">jdMenu - Hierarchical Menu Plugin for jQuery</a>.<br />
<a href="http://be.twixt.us/jquery/suckerFish.php">jQuery SuckerFish Style</a>.<br />
<a href="http://bassistance.de/jquery-plugins/jquery-plugin-treeview/">jQuery Plugin Treeview</a>.<br />
<a href="http://be.twixt.us/jquery/treeView.php">treeView Basic</a>.<br />
<a href="http://labs.activespotlight.net/jQuery/menu_demo.html">FastFind Menu</a>.<br />
<a href="http://www.getintothis.com/blog/2006/09/26/my-first-jquery-plugin-a-sliding-menu/">Sliding Menu</a>.<br />
<a href="http://gmarwaha.com/blog/?p=7">Lava Lamp jQuery Menu</a>.<br />
<a href="http://icon.cat/wiki/IconDock_En#iconDock_jQuery_Plugin">jQuery iconDock</a>.<br />
<a href="http://cherne.net/brian/resources/jquery.variations.html">jVariations Control Panel</a>.<br />
<a href="http://www.trendskitchens.co.nz/jquery/contextmenu/">ContextMenu plugin</a>.<br />
<a href="http://p.sohei.org/jquery-plugins/clickmenu/">clickMenu</a>.<br />
<a href="http://www.ndesign-studio.com/blog/mac/css-dock-menu">CSS Dock Menu</a>.<br />
<a href="http://webexpose.org/2006/12/28/jquery-pop-up-menu-tutorial/">jQuery Pop-up Menu Tutorial</a>.<br />
<a href="http://www.getintothis.com/blog/2006/09/26/my-first-jquery-plugin-a-sliding-menu/">Sliding Menu</a>. </p>
<p><a title="http://stilbuero.de/jquery/tabs_3/" href="http://stilbuero.de/jquery/tabs_3/">http://stilbuero.de/jquery/tabs_3/</a> </p>
<h2>幻灯、翻转等(Accordions, Slide and Toggle stuff)</h2>
<p><a href="http://bassistance.de/jquery-plugins/jquery-plugin-accordion/">jQuery Plugin Accordion</a>.<br />
<a href="http://fmarcia.info/jquery/accordion.html">jQuery Accordion Plugin Horizontal Way</a>.<br />
<a href="http://letmehaveblog.blogspot.com/2007/10/haccordion-simple-horizontal-accordion.html">haccordion - a simple horizontal accordion plugin for jQuery</a>.<br />
<a href="http://dev.portalzine.de/index?/Horizontal_Accordion--print">Horizontal Accordion by portalzine.de</a>.<br />
<a href="http://berndmatzner.de/jquery/hoveraccordion/">HoverAccordion</a>.<br />
<a href="http://fmarcia.info/jquery/accordion.html">Accordion Example from fmarcia.info</a>.<br />
<a href="http://blog.evaria.com/wp-content/themes/blogvaria/jquery/index.php">jQuery Accordion Example</a>.<br />
<a href="http://jquery.com/files/demo/dl-done.html">jQuery Demo - Expandable Sidebar Menu</a>.<br />
<a href="http://www.andreacfm.com/examples/jQpanels/">Sliding Panels for jQuery</a>.<br />
<a href="http://jquery.andreaseberhard.de/toggleElements/">jQuery ToggleElements</a>.<br />
<a href="http://www.ndoherty.com/demos/coda-slider/">Coda Slider</a>.<br />
<a href="http://sorgalla.com/projects/jcarousel/#Examples">jCarousel</a>.<br />
<a href="http://www.reindel.com/accessible_news_slider/">Accesible News Slider Plugin</a>.<br />
<a href="http://icant.co.uk/sandbox/jquerycodeview/">Showing and Hiding code Examples</a>.<br />
<a href="http://gsgd.co.uk/sandbox/jquery/easing/">jQuery Easing Plugin</a>.<br />
<a href="http://sonspring.com/journal/jquery-portlets">jQuery Portlets</a>.<br />
<a href="http://jdsharp.us/jQuery/plugins/AutoScroll/">AutoScroll</a>.<br />
<a href="http://medienfreunde.com/lab/innerfade/">Innerfade</a>.
<h2>拖放插件(Drag and Drop)</h2>
<p><a href="http://docs.jquery.com/UI/Draggables">UI/Draggables</a>.<br />
<a href="http://fromvega.com/wordpress/2007/07/14/easydrag-jquery-plugin/">EasyDrag jQuery Plugin</a>.<br />
<a href="http://sonspring.com/journal/jquery-portlets">jQuery Portlets</a>.<br />
<a href="http://dev.iceburg.net/jquery/jqDnR/">jqDnR - drag, drop resize</a>.<br />
<a href="http://interface.eyecon.ro/demos/drag.html">Drag Demos</a>.
<h2>XML XSL JSON Feeds</h2>
<p><a href="http://www.jongma.org/webtools/jquery/xslt/">XSLT Plugin</a>.<br />
<a href="http://cgaskell.wordpress.com/2006/11/02/jquery-ajax-call-and-result-xml-parsing/">jQuery Ajax call and result XML parsing</a>.<br />
<a href="http://jquery.com/plugins/project/xmlObjectifier">xmlObjectifier - Converts XML DOM to JSON</a>.<br />
<a href="http://jquery.glyphix.com/">jQuery XSL Transform</a>.<br />
<a href="http://malsup.com/jquery/taconite/">jQuery Taconite - multiple Dom updates</a>.<br />
<a href="http://www.hovinne.com/blog/index.php/2007/07/15/132-jfeed-jquery-rss-atom-feed-parser-plugin">RSS/ATOM Feed Parser Plugin</a>.<br />
<a href="http://www.malsup.com/jquery/gfeed/">jQuery Google Feed Plugin</a>.
<h2>浏览器(Browserstuff)</h2>
<p><a href="http://noteslog.com/post/how-to-fix-the-resize-event-in-ie/">Wresize - IE Resize event Fix Plugin</a>.<br />
<a href="http://jquery.khurshid.com/ifixpng.php">jQuery ifixpng</a>.<br />
<a href="http://jquery.andreaseberhard.de/pngFix/">jQuery pngFix</a>.<br />
<a href="http://www.crismancich.de/jquery/plugins/linkscrubber/">Link Scrubber - removes the dotted line onfocus from links</a>.<br />
<a href="http://www.matthewjrichards.co.uk/articles/2007/06/25/jquery-perciformes-the-entire-suckerfish-familly-under-one-roof">jQuery Perciformes - the entire suckerfish familly under one roof</a>.<br />
<a href="http://blog.brandonaaron.net/my-jquery-plugins/background-iframe/">Background Iframe</a>.<br />
<a href="http://jquery.com/plugins/project/QinIE">QinIE - for proper display of Q tags in IE</a>.<br />
<a href="http://webrocket.ulmb.com/ability/">jQuery Accessibility Plugin</a>.<br />
<a href="http://www.ogonek.net/mousewheel/jquery-demo.html">jQuery MouseWheel Plugin</a>.
<h2>对话框、确认窗口(Alert, Prompt, Confirm Windows)</h2>
<p><a href="http://trentrichardson.com/Impromptu/">jQuery Impromptu</a>.<br />
<a href="http://nadiaspot.com/jquery/confirm">jQuery Confirm Plugin</a>.<br />
<a href="http://dev.iceburg.net/jquery/jqModal/">jqModal</a>.<br />
<a href="http://www.ericmmartin.com/projects/simplemodal/">SimpleModal</a>.
<h2>CSS</h2>
<p><a href="http://www.kelvinluck.com/article/switch-stylesheets-with-jquery">jQuery Style Switcher</a>.<br />
<a href="http://andykent.bingodisk.com/bingo/public/jss/">JSS - Javascript StyleSheets</a>.<br />
<a href="http://flesler.blogspot.com/2007/11/jqueryrule.html">jQuery Rule - creation/manipulation of CSS Rules</a>.<br />
<a href="http://www.designerkamal.com/jPrintArea/">jPrintArea</a>.
<h2>DOM、AJAX和其它JQuery插件（DOM, Ajax and other jQuery plugins）</h2>
<p><a href="http://flydom.socianet.com/">FlyDOM</a>.<br />
<a href="http://brandonaaron.net/docs/dimensions/#getting-started">jQuery Dimenion Plugin</a>.<br />
<a href="http://happygiraffe.net/blog/articles/2007/09/26/jquery-logging">jQuery Loggin</a>.<br />
<a href="http://jquery.com/plugins/project/metadata">Metadata - extract metadata from classes, attributes, elements</a>.<br />
<a href="http://johannburkard.de/blog/programming/javascript/inc-a-super-tiny-client-side-include-javascript-jquery-plugin.html">Super-tiny Client-Side Include Javascript jQuery Plugin</a>.<br />
<a href="http://humanized.com/weblog/2007/09/14/undo-made-easy-with-ajax-part-1/">Undo Made Easy with Ajax</a>.<br />
<a href="http://www.jasons-toolbox.com/JHeartbeat/">JHeartbeat - periodically poll the server</a>.<br />
<a href="http://www.appelsiini.net/projects/lazyload">Lazy Load Plugin</a>.<br />
<a href="http://blog.brandonaaron.net/2007/08/19/new-plugin-live-query/">Live Query</a>.<br />
<a href="http://jquery.offput.ca/every/">jQuery Timers</a>.<br />
<a href="http://www.joanpiedra.com/jquery/shareit/">jQuery Share it - display social bookmarking icons</a>.<br />
<a href="http://www.jdempster.com/category/code/jquery/cookiejar/">jQuery serverCookieJar</a>.<br />
<a href="http://ideamill.synaptrixgroup.com/?p=3">jQuery autoSave</a>.<br />
<a href="http://www.semicomplete.com/blog/geekery/jquery-interface-puffer.html">jQuery Puffer</a>.<br />
<a href="http://33rockers.com/jquery/iframe-demo/">jQuery iFrame Plugin</a>.<br />
<a href="http://www.stilbuero.de/2006/09/17/cookie-plugin-for-jquery/">Cookie Plugin for jQuery</a>.<br />
<a href="http://leftlogic.com/lounge/articles/jquery_spy2">jQuery Spy - awesome plugin</a>.<br />
<a href="http://www.learningjquery.com/2007/01/effect-delay-trick">Effect Delay Trick</a>.<br />
<a href="http://jquick.sullof.com/jquick/">jQuick - a quick tag creator for jQuery</a>.<a href="http://noteslog.com/post/metaobjects-11-released-today/"><br />
Metaobjects</a>.<br />
<a href="http://www.thunderguy.com/semicolon/2007/08/14/elementready-jquery-plugin/">elementReady</a>.
<p>英文：<a title="http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/" href="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.blogjava.net/joan/aggbug/307918.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/joan/" target="_blank">joan</a> 2009-12-31 15:36 <a href="http://www.blogjava.net/joan/articles/307918.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>JavaScript多线程编程</title><link>http://www.blogjava.net/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.blogjava.net/joan/articles/232317.html</guid><wfw:comment>http://www.blogjava.net/joan/comments/232317.html</wfw:comment><comments>http://www.blogjava.net/joan/articles/232317.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/joan/comments/commentRss/232317.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/joan/services/trackbacks/232317.html</trackback:ping><description><![CDATA[<h3>
<div class="blog_content">
<h3>AJAX 开发中的难题</h3>
<p>让我们通过一个简单的例子来认识这个问题。假设你要建立一个树形结构的公告栏系统(BBS)，它可以根据用户请求与服务器进行交互，动态加载每篇文章的信息，而不是一次性从服务器载入所有文章信息。每篇文章有四个相关属性：系统中可以作为唯一标识的ID、发贴人姓名、文章内容以及包含其所有子文章ID的数组信息。首先假定有一个名为getArticle()的函数可以加载一篇文章信息。该函数接收的参数是要加载文章的ID，通过它可从服务器获取文章信息。它返回的对象包含与文章相关的四条属性：id，name，content和children。例程如下：</p>
<pre>function ( id ) {
var a = getArticle(id);
document.writeln(a.name + "
" + a.content);
} </pre>
<p>然而你也许会注意到，重复用同一个文章ID调用此函数，需要与服务器之间进行反复且无益的通信。想要解决这个问题，可以考虑使用函数 getArticleWithCache()，它相当于一个带有缓存能力的getArticle()。在这个例子中，getArticle()返回的数据只是作为一个全局变量被保存下来：</p>
<pre>var cache = {};
function getArticleWithCache ( id ) {
if ( !cache[id] ) {
cache[id] = getArticle(id);
}
return cache[id];
} </pre>
<p>现在已将读入的文章缓存起来，让我们再来考虑一下函数backgroundLoad()，它应用我们上面提到的缓存机制加载所有文章信息。其用途是，当读者在阅读某篇文章时，从后台预加载它所有子文章。因为文章数据是树状结构的，所以很容易写一个递归的算法来遍历树并且加载所有的文章：</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数组作为参数，然后通过每个ID调用前面定义过的getArticldWithCache()方法，这样就把每个ID对应的文章缓存起来。之后再通过已加载文章的子文章ID数组递归调用backgroundLoad()方法，如此整个文章树就被缓存起来。</p>
<p>到目前为止，一切似乎看起来都很完美。然而，只要你有过开发AJAX应用的经验，你就应该知晓这种幼稚的实现方法根本不会成功，这个例子成立的基础是默认 getArticle()用的是同步通信。可是，作为一条基本原则，JavaScript要求在与服务器进行交互时要用异步通信，因为它是单线程的。就简单性而言，把每一件事情（包括GUI事件和渲染）都放在一个线程里来处理是一个很好的程序模型，因为这样就无需再考虑线程同步这些复杂问题。另一方面，他也暴露了应用开发中的一个严重问题，单线程环境看起来对用户请求响应迅速，但是当线程忙于处理其它事情时(比如说调用getArticle())，就不能对用户的鼠标点击和键盘操作做出响应。 </p>
<p>如果在这个单线程环境里进行同步通信会发生什么事情呢？同步通信会中断浏览器的执行直至获得通信结果。在等待通信结果的过程中，由于服务器的调用还没有完成，线程会停止响应用户并保持锁定状态直到调用返回。因为这个原因，当浏览器在等待服务器响应时它不能对用户行为作出响应，所以看起来像是冻结了。当执行 getArticleWithCache()和backgroundLoad()会有同样的问题，因为它们都是基于getArticle()函数的。由于下载所有的文章可能会耗费很可观的一段时间，因此对于backgroundLoad()函数来说，浏览器在此段时间内的冻结就是一个很严重的问题——既然浏览器都已经冻结，当用户正在阅读文章时就不可能首先去执行后台预加载数据，如果这样做连当前的文章都没办法读。</p>
<p>如上所述，既然同步通信在使用中会造成如此严重的问题，JavaScript就把异步通信作为一条基本原则。因此，我们可以基于异步通信改写上面的程序。 JavaScript要求以一种事件驱动的程序设计方式来写异步通信程序。在很多场合中，你都必须指定一个回调程序，一旦收到通信响应，这个函数就会被调用。例如，上面定义的getArticleWithCache()可以写成这样：</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>这个程序也在内部调用了getArticle()函数。然而需要注意的是，为异步通信设计的这版getArticle()函数要接收一个函数作为第二个参数。当调用这个getArticle()函数时，与从前一样要给服务器发送一个请求，不同的是，现在函数会迅速返回而非等待服务器的响应。这意味着，当执行权交回给调用程序时，还没有得到服务器的响应。如此一来，线程就可以去执行其它任务直至获得服务器响应，并在此时调用回调函数。一旦得到服务器响应， getArticle()的第二个参数作为预先定义的回调函数就要被调用，服务器的返回值即为其参数。同样的，getArticleWithCache ()也要做些改变，定义一个回调参数作为其第二个参数。这个回调函数将在被传给getArticle()的回调函数中调用，因而它可以在服务器通信结束后被执行。</p>
<p>单是上面这些改动你可能已经认为相当复杂了，但是对backgroundLoad()函数做得改动将会更复杂，它也要被改写成可以处理回调函数的形式：</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()函数看上去和我们以前的那个函数已经相去甚远，不过他们所实现的功能并无二致。这意味着这两个函数都接受ID数组作为参数，对于数组里的每个元素都要调用getArticleWithCache()，再应用已经获得子文章ID递归调用backgroundLoad ()。不过同样是对数组的循环访问，新函数中的就不太好辨认了，以前的程序中是用一个for循环语句完成的。为什么实现同样功能的两套函数是如此的大相径庭呢？</p>
<p>这个差异源于一个事实：任何函数在遇到有需要同服务器进行通信情况后，都必须立刻返回，例如getArticleWithCache()。除非原来的函数不在执行当中，否则应当接受服务器响应的回调函数都不能被调用。对于JavaScript，在循环过程中中断程序并在稍后从这个断点继续开始执行程序是不可能的，例如一个for语句。因此，本例利用递归传递回调函数实现循环结构而非一个传统循环语句。对那些熟悉连续传送风格(CPS)的人来说，这就是一个 CPS的手动实现，因为不能使用循环语法，所以即便如前面提到的遍历树那么简单的程序也得写得很复杂。与事件驱动程序设计相关的问题是<a href="http://www.cis.upenn.edu/~stevez/papers/LZ04a.pdf">控制流问题</a>：循环和其它控制流表达式可能比较难理解。</p>
<p>这里还有另外一个问题：如果你把一个没有应用异步通信的函数转换为一个使用异步通信的函数，那么重写的函数将需要一个回调函数作为新增参数，这为已经存在的APIs造成了很大问题，因为内在的改变没有把影响限于内部，而是导致整体混乱的APIs以及API的其它使用者的改变。</p>
<p>造成这些问题目的根本原因是什么呢？没错，正是JavaScript单线程机制导致了这些问题。在单线程里执行异步通信需要事件驱动程序设计和复杂的语句。如果当程序在等待服务器的响应时，有另外一个线程可以来处理用户请求，那么上述复杂技术就不需要了。</p>
<h3>试试多线程编程</h3>
<p>让我来介绍一下Concurrent.Thread，它是一个允许JavaScript进行多线程编程的库，应用它可以大大缓解上文提及的在AJAX开发中与异步通信相关的困难。这是一个用JavaScript写成的免费的软件库，使用它的前提是遵守Mozilla Public License和GNU General Public License这两个协议。你可以从<a href="http://jsthread.sourceforge.net/">他们的网站 </a>下载源代码。</p>
<p>马上来下载和使用源码吧！假定你已经将下载的源码保存到一个名为Concurrent.Thread.js的文件夹里，在进行任何操作之前，先运行如下程序，这是一个很简单的功能实现：</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>执行这个程序将会顺序显示从0开始的数字，它们一个接一个出现，你可以滚屏来看它。现在让我们来仔细研究一下代码，他应用while(1)条件制造了一个不会中止的循环，通常情况下，象这样不断使用一个并且是唯一一个线程的JavaScript程序会导致浏览器看起来象冻结了一样，自然也就不会允许你滚屏。那么为什么上面的这段程序允许你这么做呢？关键之处在于while(1)上面的那条Concurrent.Thread.create()语句，这是这个库提供的一个方法，它可以创建一个新线程。被当做参数传入的函数在这个新线程里执行，让我们对程序做如下微调：</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()可以重复显示数字，它是在程序段起始定义的，接着以f()为参数调用了两次create()方法，传给create()方法的第二个参数将会不加修改地传给f()。执行这个程序，先会看到一些从0开始的小数，接着是一些从100,000开始的大数，然后又是接着前面小数顺序的数字。你可以观察到程序在交替显示小数和大数，这说明两个线程在同时运行。</span></p>
<p>让我来展示Concurrent.Thread的另外一个用法。上面的例子调用create()方法来创建新线程。不调用库里的任何APIs也有可能实现这个目的。例如，前面那个例子可以这样写：</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写了一个无穷循环。你应该注意到标签内的type属性，那里是一个很陌生的值(text/x- script.multithreaded-js)，如果这个属性被放在script标签内，那么Concurrent.Thread就会在一个新的线程内执行标签之间的程序。你应当记住一点，在本例一样，必须将Concurrent.Thread库包含进来。</span></p>
<p>有了Concurrent.Thread，就有可能自如的将执行环境在线程之间进行切换，即使你的程序很长、连续性很强。我们可以简要地讨论下如何执行这种操作。简言之，需要进行代码转换。粗略地讲，首先要把传递给create()的函数转换成一个字符串，接着改写直至它可以被分批分次执行。然后这些程序可以依照调度程序逐步执行。调度程序负责协调多线程，换句话说，它可以在适当的时候做出调整以便每一个修改后的函数都会得到同等机会运行。 Concurrent.Thread实际上并没有创建新的线程，仅仅是在原本单线程的基础上模拟了一个多线程环境。</p>
<p>虽然转换后的函数看起来是运行在不同的线程内，但是实际上只有一个线程在做这所有的事情。在转换后的函数内执行同步通信仍然会造成浏览器冻结，你也许会认为以前的那些问题根本就没有解决。不过你不必耽心，Concurrent.Thread提供了一个应用JavaScript 的异步通信方式实现的定制通信库，它被设计成当一个线程在等待服务器的响应时允许其它线程运行。这个通信库存于 Concurrent.Thread.Http下。它的用法如下所示：</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()方法，就像它的名字暗示的那样，可以通过HTTP的GET方法获得指定URL的内容，它将目标URL作为第一个参数，将一个代表HTTP请求头的数组作为可选的第二个参数。get()方法与服务器交互，当得到服务器的响应后就返回一个XMLHttpRequest对象作为返回值。当get()方法返回时，已经收到了服务器响应，所以就没必要再用回调函数接收结果。自然，也不必再耽心当程序等待服务器的响应时浏览器冻结的情况了。另外，还有一个 post()方法可以用来发送数据到服务器：</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()方法将目的URL作为第一个参数，要发送的内容作为第二个参数。像get()方法那样，你也可以将请求头作为可选的第三个参数。</p>
<p>如果你用这个通信库实现了第一个例子当中的getArticle()方法，那么你很快就能应用文章开头示例的那种简单的方法写出getArticleWithCache(),backgroundLoad ()以及其它调用了getArticle()方法的函数了。即使是那版backgroundLoad()正在读文章数据，照例还有另外一个线程可以对用户请求做出响应，浏览器因此也不会冻结。现在，你能理解在JavaScript中应用多线程有多实用了？</p>
<h3>想了解更多</h3>
<p>我向你介绍了一个可以在JavaScript中应用多线程的库：Concurrent.Thread。这篇文章的内容只是很初级的东西，如果你想更深入的了解，我推荐您去看<a href="http://jsthread.sourceforge.net/cgi-bin/wiki/wiki.cgi?page=A+Tutorial">the tutorial</a>。它提供有关Concurrent.Thread用法的更多内容，并列出了可供高级用户使用的文档，是最适合起步的材料。访问<a href="http://jsthread.sourceforge.net/">他们的网站</a>也不错，那里提供更多信息。</p>
</div>
</h3><img src ="http://www.blogjava.net/joan/aggbug/232317.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/joan/" target="_blank">joan</a> 2008-10-04 14:18 <a href="http://www.blogjava.net/joan/articles/232317.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>js正则表达式</title><link>http://www.blogjava.net/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.blogjava.net/joan/articles/222371.html</guid><wfw:comment>http://www.blogjava.net/joan/comments/222371.html</wfw:comment><comments>http://www.blogjava.net/joan/articles/222371.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.blogjava.net/joan/comments/commentRss/222371.html</wfw:commentRss><trackback:ping>http://www.blogjava.net/joan/services/trackbacks/222371.html</trackback:ping><description><![CDATA[<div class="lh3" id="veryContent" style="overflow: hidden; width: 100%; height: 2px"></div>
<div 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="" />//校验是否全由数字组成 <br />
[code] function isDigit(s) { var patrn=/^[0-9]{1,20}$/; if (!patrn.exec(s)) return false return true } [/code] <br />
//校验登录名：只能输入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 />
//校验用户姓名：只能输入1-30个以字母开头的字串 <br />
[code] function isTrueName(s) { var patrn=/^[a-zA-Z]{1,30}$/; if (!patrn.exec(s)) return false return true } }} //校验密码：只能输入6-20个字母、数字、下划线 [code] function isPasswd(s) { var patrn=/^(\w){6,20}$/; if (!patrn.exec(s)) return false return true } [/code] <br />
//校验普通电话、传真号码：可以&#8220;+&#8221;开头，除数字外，可含有&#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 />
//校验手机号码：必须以数字开头，除数字外，可含有&#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+$"　　//非负整数（正整数 + 0） "^[0-9]*[1-9][0-9]*$"　　//正整数 "^((-\\d+)|(0+))$"　　//非正整数（负整数 + 0） "^-[0-9]*[1-9][0-9]*$"　　//负整数 "^-?\\d+$"　　　　//整数 "^\\d+(\\.\\d+)?$"　　//非负浮点数（正浮点数 + 0） "^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$"　 //正浮点数 "^((-\\d+(\\.\\d+)?)|(0+(\\.0+)?))$"　　//非正浮点数（负浮点数 + 0） "^(-(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*)))$"　 //负浮点数 "^(-?\\d+)(\\.\\d+)?$"　　//浮点数 "^[A-Za-z]+$"　　//由26个英文字母组成的字符串 "^[A-Z]+$"　　//由26个英文字母的大写组成的字符串 "^[a-z]+$"　　//由26个英文字母的小写组成的字符串 "^[A-Za-z0-9]+$"　　//由数字和26个英文字母组成的字符串 "^\\w+$"　　//由数字、26个英文字母或者下划线组成的字符串 "^[\\w-]+(\\.[\\w-]+)*@[\\w-]+(\\.[\\w-]+)+$"　　　　//email地址 "^[a-zA-z]+://(\\w+(-\\w+)*)(\\.(\\w+(-\\w+)*))*(\\?\\S*)?$"　　//url "^[A-Za-z0-9_]*$" [/code] <br />
正则表达式使用详解 <br />
简介 <br />
简单的说，正则表达式是一种可以用于模式匹配和替换的强有力的工具。其作用如下： <br />
测试字符串的某个模式。例如，可以对一个输入字符串进行测试，看在该字符串是否存在一个电话号码模式或一个信用卡号码模式。这称为数据有效性验证。 <br />
替换文本。可以在文档中使用一个正则表达式来标识特定文字，然后可以全部将其删除，或者替换为别的文字。 <br />
根据模式匹配从字符串中提取一个子字符串。可以用来在文本或输入字段中查找特定文字。 <br />
基本语法 <br />
在对正则表达式的功能和作用有了初步的了解之后，我们就来具体看一下正则表达式的语法格式。 <br />
正则表达式的形式一般如下：　　 <br />
/love/　　其中位于&#8220;/&#8221;定界符之间的部分就是将要在目标对象中进行匹配的模式。用户只要把希望查找匹配对象的模式内容放入&#8220;/&#8221;定界符之间即可。为了能够使用户更加灵活的定制模式内容，正则表达式提供了专门的&#8220;元字符&#8221;。所谓元字符就是指那些在正则表达式中具有特殊意义的专用字符，可以用来规定其前导字符（即位于元字符前面的字符）在目标对象中的出现模式。 <br />
较为常用的元字符包括： &#8220;+&#8221;， &#8220;*&#8221;，以及 &#8220;?&#8221;。 <br />
&#8220;+&#8221;元字符规定其前导字符必须在目标对象中连续出现一次或多次。 <br />
&#8220;*&#8221;元字符规定其前导字符必须在目标对象中出现零次或连续多次。 <br />
&#8220;?&#8221;元字符规定其前导对象必须在目标对象中连续出现零次或一次。 <br />
下面，就让我们来看一下正则表达式元字符的具体应用。 <br />
/fo+/　　因为上述正则表达式中包含&#8220;+&#8221;元字符，表示可以与目标对象中的 &#8220;fool&#8221;, &#8220;fo&#8221;, 或者 &#8220;football&#8221;等在字母f后面连续出现一个或多个字母o的字符串相匹配。 <br />
/eg*/　　因为上述正则表达式中包含&#8220;*&#8221;元字符，表示可以与目标对象中的 &#8220;easy&#8221;, &#8220;ego&#8221;, 或者 &#8220;egg&#8221;等在字母e后面连续出现零个或多个字母g的字符串相匹配。 <br />
/Wil?/　　因为上述正则表达式中包含&#8220;？&#8221;元字符，表示可以与目标对象中的 &#8220;Win&#8221;, 或者&#8220;Wilson&#8221;,等在字母i后面连续出现零个或一个字母l的字符串相匹配。 <br />
有时候不知道要匹配多少字符。为了能适应这种不确定性，正则表达式支持限定符的概念。这些限定符可以指定正则表达式的一个给定组件必须要出现多少次才能满足匹配。 <br />
{n} n 是一个非负整数。匹配确定的 n 次。例如，'o{2}' 不能匹配 "Bob" 中的 'o'，但是能匹配 "food" 中的两个 o。 <br />
{n,} n 是一个非负整数。至少匹配 n 次。例如，'o{2,}' 不能匹配 "Bob" 中的 'o'，但能匹配 "foooood" 中的所有 o。'o{1,}' 等价于 'o+'。'o{0,}' 则等价于 'o*'。 <br />
{n,m} m 和 n 均为非负整数，其中n &lt;= m。最少匹配 n 次且最多匹配 m 次。例如，"o{1,3}" 将匹配 "fooooood" 中的前三个 o。'o{0,1}' 等价于 'o?'。请注意在逗号和两个数之间不能有空格。 <br />
除了元字符之外，用户还可以精确指定模式在匹配对象中出现的频率。例如，/jim {2,6}/ 上述正则表达式规定字符m可以在匹配对象中连续出现2-6次，因此，上述正则表达式可以同jimmy或jimmmmmy等字符串相匹配。 <br />
在对如何使用正则表达式有了初步了解之后，我们来看一下其它几个重要的元字符的使用方式。 <br />
[code] \s：用于匹配单个空格符，包括tab键和换行符； \S：用于匹配除单个空格符之外的所有字符； \d：用于匹配从0到9的数字； \w：用于匹配字母，数字或下划线字符； \W：用于匹配所有与\w不匹配的字符； . ：用于匹配除换行符之外的所有字符。 [/code] <br />
（说明：我们可以把\s和\S以及\w和\W看作互为逆运算） <br />
下面，我们就通过实例看一下如何在正则表达式中使用上述元字符。 <br />
/\s+/ 上述正则表达式可以用于匹配目标对象中的一个或多个空格字符。 <br />
/\d000/　如果我们手中有一份复杂的财务报表，那么我们可以通过上述正则表达式轻而易举的查找到所有总额达千元的款项。 <br />
除了我们以上所介绍的元字符之外，正则表达式中还具有另外一种较为独特的专用字符，即定位符。定位符用于规定匹配模式在目标对象中的出现位置。 较为常用的定位符包括： &#8220;^&#8221;, &#8220;$&#8221;, &#8220;\b&#8221; 以及 &#8220;\B&#8221;。 <br />
[code] &#8220;^&#8221;定位符规定匹配模式必须出现在目标字符串的开头 &#8220;$&#8221;定位符规定匹配模式必须出现在目标对象的结尾 &#8220;\b&#8221;定位符规定匹配模式必须出现在目标字符串的开头或结尾的两个边界之一 &#8220;\B&#8221;定位符则规定匹配对象必须位于目标字符串的开头和结尾两个边界之内， 即匹配对象既不能作为目标字符串的开头，也不能作为目标字符串的结尾。 [/code] <br />
同样，我们也可以把&#8220;^&#8221;和&#8220;$&#8221;以及&#8220;\b&#8221;和&#8220;\B&#8221;看作是互为逆运算的两组定位符。举例来说： /^hell/　因为上述正则表达式中包含&#8220;^&#8221;定位符，所以可以与目标对象中以 &#8220;hell&#8221;, &#8220;hello&#8221;或&#8220;hellhound&#8221;开头的字符串相匹配。 /ar$/　因为上述正则表达式中包含&#8220;$&#8221;定位符，所以可以与目标对象中以 &#8220;car&#8221;, &#8220;bar&#8221;或 &#8220;ar&#8221; 结尾的字符串相匹配。 /\bbom/　因为上述正则表达式模式以&#8220;\b&#8221;定位符开头，所以可以与目标对象中以 &#8220;bomb&#8221;, 或 &#8220;bom&#8221;开头的字符串相匹配。/man\b/　因为上述正则表达式模式以&#8220;\b&#8221;定位符结尾，所以可以与目标对象中以 &#8220;human&#8221;, &#8220;woman&#8221;或 &#8220;man&#8221;结尾的字符串相匹配。 <br />
为了能够方便用户更加灵活的设定匹配模式，正则表达式允许使用者在匹配模式中指定某一个范围而不局限于具体的字符。例如： <br />
[code] /[A-Z]/　　上述正则表达式将会与从A到Z范围内任何一个大写字母相匹配。 /[a-z]/　　上述正则表达式将会与从a到z范围内任何一个小写字母相匹配。 /[0-9]/ 　上述正则表达式将会与从0到9范围内任何一个数字相匹配。 /([a-z][A-Z][0-9])+/　上述正则表达式将会与任何由字母和数字组成的字符串，如 &#8220;aB0&#8221; 等相匹配。 [/code] <br />
这里需要提醒用户注意的一点就是可以在正则表达式中使用 &#8220;()&#8221; 把字符串组合在一起。&#8220;()&#8221;符号包含的内容必须同时出现在目标对象中。因此，上述正则表达式将无法与诸如 &#8220;abc&#8221;等的字符串匹配，因为&#8220;abc&#8221;中的最后一个字符为字母而非数字。 <br />
如果我们希望在正则表达式中实现类似编程逻辑中的&#8220;或&#8221;运算，在多个不同的模式中任选一个进行匹配的话，可以使用管道符 &#8220;|&#8221;。例如：/to|too|2/　上述正则表达式将会与目标对象中的 &#8220;to&#8221;, &#8220;too&#8221;, 或 &#8220;2&#8221; 相匹配。 <br />
正则表达式中还有一个较为常用的运算符，即否定符 &#8220;[^]&#8221;。与我们前文所介绍的定位符 &#8220;^&#8221; 不同，否定符 &#8220;[^]&#8221;规定目标对象中不能存在模式中所规定的字符串。例如：/[^A-C]/　上述字符串将会与目标对象中除A，B，和C之外的任何字符相匹配。一般来说，当&#8220;^&#8221;出现在 &#8220;[]&#8221;内时就被视做否定运算符；而当&#8220;^&#8221;位于&#8220;[]&#8221;之外，或没有&#8220;[]&#8221;时，则应当被视做定位符。 <br />
最后，当用户需要在正则表达式的模式中加入元字符，并查找其匹配对象时，可以使用转义符&#8220;\&#8221;。例如：/Th\*/ 　上述正则表达式将会与目标对象中的&#8220;Th*&#8221;而非&#8220;The&#8221;等相匹配。 <br />
在构造正则表达式之后，就可以象数学表达式一样来求值，也就是说，可以从左至右并按照一个优先级顺序来求值。优先级如下： <br />
[code] 1．\ 转义符 2．(), (?:), (?=), [] 圆括号和方括号 3．*, +, ?, {n}, {n,}, {n,m} 限定符 4．^, $, \anymetacharacter 位置和顺序 5．|&#8220;或&#8221;操作 [/code] <br />
使用实例 <br />
在JavaScript 1.2中带有一个功能强大的RegExp()对象，可以用来进行正则表达式的匹配操作。其中的test()方法可以检验目标对象中是否包含匹配模式，并相应的返回true或false。 <br />
我们可以使用JavaScript编写以下脚本，验证用户输入的邮件地址的有效性。 <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 />
本对象包含正则表达式模式以及表明如何应用模式的标志。 <br />
[code] 语法 1 re = /pattern/[flags] 语法 2 re = new RegExp("pattern",["flags"]) [/code] <br />
参数 <br />
re <br />
必选项。将要赋值为正则表达式模式的变量名。 <br />
Pattern <br />
必选项。要使用的正则表达式模式。如果使用语法 1，用 "/" 字符分隔模式。如果用语法 2，用引号将模式引起来。 <br />
Flags <br />
可选项。如果使用语法 2 要用引号将 flag 引起来。标志可以组合使用，可用的有： <br />
[code] g （全文查找出现的所有 pattern） i （忽略大小写） m （多行查找） [/code] <br />
示例 <br />
下面的示例创建一个包含正则表达式模式及相关标志的对象(re)，向您演示正则表达式对象的用法。在本例中，作为结果的正则表达式对象又用于 match 方法中： <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); // 在字符串 s 中查找匹配。 return(r); } [/code] <br />
返回值： ain,ain,ain,ain\\ <br />
属性 lastIndex 属性 | source 属性\\ <br />
方法 compile 方法 | exec 方法 | test 方法\\ <br />
要求 版本 3\\ <br />
请参阅 RegExp 对象 | 正则表达式语法 | String 对象\\ <br />
exec 方法 <br />
用正则表达式模式在字符串中运行查找，并返回包含该查找结果的一个数组。 <br />
rgExp.exec(str) <br />
参数 <br />
rgExp <br />
必选项。包含正则表达式模式和可用标志的正则表达式对象。 <br />
str <br />
必选项。要在其中执行查找的 String 对象或字符串文字。 <br />
说明\\ <br />
如果 exec 方法没有找到匹配，则它返回 null。如果它找到匹配，则 exec 方法返回一个数组，并且更新全局 RegExp 对象的属性，以反映匹配结果。数组的0元素包含了完整的匹配，而第1到n元素中包含的是匹配中出现的任意一个子匹配。这相当于没有设置全局标志 (g) 的 match 方法。 <br />
如果为正则表达式设置了全局标志，exec 从以 lastIndex 的值指示的位置开始查找。如果没有设置全局标志，exec 忽略 lastIndex 的值，从字符串的起始位置开始搜索。 <br />
exec 方法返回的数组有三个属性，分别是 input、index 和 lastIndex。Input 属性包含了整个被查找的字符串。Index 属性中包含了整个被查找字符串中被匹配的子字符串的位置。LastIndex 属性中包含了匹配中最后一个字符的下一个位置。 <br />
示例\\ <br />
下面的例子举例说明了 exec 方法的用法： <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 />
返回值：0-3The 4-8rain 9-11in 12-17Spain 18-23falls 24-30mainly 31-33in 34-37the 38-43plain <br />
test 方法\\ <br />
返回一个 Boolean 值，它指出在被查找的字符串中是否存在模式。 <br />
rgexp.test(str) <br />
参数\\ <br />
rgexp <br />
必选项。包含正则表达式模式或可用标志的正则表达式对象。 <br />
str <br />
必选项。要在其上测试查找的字符串。 <br />
说明 <br />
test 方法检查在字符串中是否存在一个模式，如果存在则返回 true，否则就返回 false。 <br />
全局 RegExp 对象的属性不由 test 方法来修改。 <br />
示例 <br />
下面的例子举例说明了 test 方法的用法： <br />
[code] function TestDemo(re, s) { var s1; // 声明变量。 // 检查字符串是否存在正则表达式。 if (re.test(s)) // 测试是否存在。 s1 = " contains "; // s 包含模式。 else s1 = " does not contain "; // s 不包含模式。 return("'" + s + "'" + s1 + "'"+ re.source + "'"); // 返回字符串。 } [/code] <br />
函数调用：document.write (TestDemo(/ain+/ ,"The rain in Spain falls mainly in the plain.")); <br />
返回值：'The rain in Spain falls mainly in the plain.' contains 'ain+' <br />
match 方法 <br />
使用正则表达式模式对字符串执行查找，并将包含查找的结果作为数组返回。\\ <br />
stringObj.match(rgExp) <br />
参数\\ <br />
stringObj <br />
必选项。对其进行查找的 String 对象或字符串文字。 <br />
rgExp <br />
必选项。为包含正则表达式模式和可用标志的正则表达式对象。也可以是包含正则表达式模式和可用标志的变量名或字符串文字。 <br />
说明\\ <br />
如果 match 方法没有找到匹配，返回 null。如果找到匹配返回一个数组并且更新全局 RegExp 对象的属性以反映匹配结果。 <br />
match 方法返回的数组有三个属性：input、index 和 lastIndex。Input 属性包含整个的被查找字符串。Index 属性包含了在整个被查找字符串中匹配的子字符串的位置。LastIndex 属性包含了最后一次匹配中最后一个字符的下一个位置。 <br />
如果没有设置全局标志 (g)，数组的 0 元素包含整个匹配，而第 1 到 n 元素包含了匹配中曾出现过的任一个子匹配。这相当于没有设置全局标志的 exec 方法。如果设置了全局标志，元素 0 到 n 中包含所有匹配。 <br />
示例\\ <br />
下面的示例演示了match 方法的用法： <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); // 尝试匹配搜索字符串。 return(r); // 返回第一次出现 "ain" 的地方。 } [/code] <br />
返回值：ain <br />
本示例说明带 g 标志设置的 match 方法的用法。 <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); // 尝试去匹配搜索字符串。 return(r); // 返回的数组包含了所有 "ain" // 出现的四个匹配。 } [/code] <br />
返回值：ain,ain,ain,ain <br />
上面几行代码演示了字符串文字的 match 方法的用法。 <br />
[code] var r, re = "Spain"; r = "The rain in Spain".replace(re, "Canada"); return r; [/code] <br />
返回值：The rain in Canada <br />
search 方法 <br />
返回与正则表达式查找内容匹配的第一个子字符串的位置。 <br />
stringObj.search(rgExp) <br />
参数\\ <br />
stringObj <br />
必选项。要在其上进行查找的 String 对象或字符串文字。 <br />
rgExp <br />
必选项。包含正则表达式模式和可用标志的正则表达式对象。 <br />
说明 <br />
search 方法指明是否存在相应的匹配。如果找到一个匹配，search 方法将返回一个整数值，指明这个匹配距离字符串开始的偏移位置。如果没有找到匹配，则返回 -1。 <br />
示例\\ <br />
下面的示例演示了 search 方法的用法。 <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); // 返回 Boolean 结果。 } [/code] <br />
返回值：18</div>
<img src ="http://www.blogjava.net/joan/aggbug/222371.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/joan/" target="_blank">joan</a> 2008-08-15 23:40 <a href="http://www.blogjava.net/joan/articles/222371.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss>