一、效果搶鮮展示
此插件是我今天下午寫的，為了直觀地看到是個什么東東，先展示效果，您可以狠狠地點擊這里：搜索頁面文字jQuery插件Demo
下圖為Demo頁面的兩個測試截圖 – 測試頁面HTML代碼取自豆瓣網幫助頁面：
下載
您可以狠狠地點擊這里：jquery.textSearch-1.0.js
文件較小，功能簡單，恕不打包~~
二、功能簡述
從上圖也應該看出來了，就是對HTML頁面上的文字內容進行高亮標記，這個可以用在內容搜索上。純粹的客戶端程序，與后台一點瓜葛都沒有。
三、如何使用
使用方法是textSearch，具體為：$(選擇器). textSearch(String,可選參數)。例如，
$("body").textSearch("世界杯");
表示的含義就是查詢並紅色高亮標注body標簽下的所有的“世界杯”這個關鍵字，也就是頁面下高亮標注所有的“世界杯”文字。又如：
$(".test").textSearch("空姐 鳳姐 芙蓉姐",{markColor: "blue"});
則表示class中有test樣式的所有標簽下的“空姐”，“鳳姐”，“芙蓉姐”文字用藍色高亮標注。
此方法中，有一個參數是必須的，就是你要搜索的關鍵字字符串（默認狀況下，使用空格隔開可表示多個關鍵字），還有一個可選參數，可自定義一些樣式，關鍵字處理方法，回調函數等，具體參見本文下一部分。
四、一些可選參數
參見下表：
| 參數 | 默認值 | 說明 |
|---|---|---|
| divFlag | true | 布爾型，true表示對字符串進行多關鍵字處理，false表示不處理，整個字符串看成1個關鍵字 |
| divStr | " " | 字符串，表示分割多個關鍵字的字符，默認為空格，如果divFlag為false，此參數將失效 |
| markClass | "" | 代碼高亮的class類，默認為沒有樣式，如果設置樣式，將覆蓋默認的紅色高亮顏色值 |
| markColor | "red" | 字符串，指高亮文字的顏色值，默認紅色。markClass不為空，則此參數失效。 |
| nullReport | true | 布爾型，表示當搜索結果為空時，是否彈出提示信息。默認彈出。 |
| callback | return false; | 回調函數，默認無效果。當存在搜索結果時執行。 |
其他一些說明：
1. 高亮的文字的jQuery對象可以通過$(“span[rel='mark']“)獲取。
2. 支持中英文和各類字符搜索，支持多關鍵字搜索。
五、結勒個語
抬頭一看，文章短短的，妥妥的。js文件很小，加上注釋不足100行，難點在於稍稍復雜的正則表達式和一些相應的字符串處理！最后，本人還是顆成長期的小菠菜，資歷有限，出現問題難免。歡迎指出，不甚感謝。或者您有更好的搜索實現方案，也非常歡迎提出，交流。
原創文章，轉載請注明來自張鑫旭-鑫空間-鑫生活[http://www.zhangxinxu.com]
本文地址： http://www.zhangxinxu.com/wordpress/?p=888
本文引自：http://www.cnblogs.com/wanghun/archive/2012/03/29/2422949.html