|
|
通常擺在我們眼前的如下兩種選擇來作為我們的容器，數(shù)組或?qū)ο蟆Ｎ疫@里選擇前者，前者更輕量一點。下面我們就hasClass函數(shù)作性能改進。
原來的寫法：
復(fù)制代碼 代碼如下:
var hasClass = function(ele,cls) {
return ele.className.match(new RegExp('(//s|^)'+cls+'(//s|$)'));
}
雖然簡短，但做了太多假設(shè)了，因為元素有時是未必有className，這時直接返回false就行了。而且match是返回一個數(shù)組，和我們期望的布爾值多少有點出入（它在我以前的程序運行良好，完全拜Javascript的自動轉(zhuǎn)換所賜）。我們用search代替match：
復(fù)制代碼 代碼如下:
var hasClass = function(ele,cls) {
return ele.className.search(new RegExp('(//s|^)'+cls+'(//s|$)') > -1);
}
Prototype.js的實現(xiàn)我比較滿意，test方法在所有正則方法中是最輕量的(相反，exec是最重量，最慢，最強大)：
復(fù)制代碼 代碼如下:
var hasClass = function(el, cls) {
var classes = el.className;
return (classes > 0) ? (classes == cls ||
new RegExp("(^|//s)" + cls + "(//s|$)").test(classes)) : false;
}
到現(xiàn)在為止，基于正則方法的挖掘可謂改無可改，我們祭出緩存大法：
復(fù)制代碼 代碼如下:
(function(){
var c={};
window.hasClass=function(el, cls){
if(!c[cls]){c[cls]=new RegExp("(^|//s)"+cls+"($|//s)");}
return el.className && c[cls].test(el.className);
}
})();
如果這個正則以前創(chuàng)建過，就有以前的，沒有再創(chuàng)建，因此在大量匹配的算法中非常有優(yōu)勢。放入閉包中是為了防止命名沖突，誰會料到后面會不會殺出一個同名的全局變量c來？!使用和原來的一樣，因為我們是通過window來引用它。
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
注意如果是代替上面的test2的內(nèi)容
<img src="http://www.jb51.NET/images/logo.gif" alt="mm2" id="test2" class="dd" draggable="true">將會是true。
JavaScript技術(shù)：javascript下利用數(shù)組緩存正則表達式的實現(xiàn)方法，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。
