<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>工具：统计jQuery中各字符串出现次数</title>
<script src="http://demo.glzy8.com/jslib/jquery/jquery.js" type="text/javascript"></script>
</head>
<body>
<p>源文件(将jQuery源码复制到下面的文本域)：</p>
<p><textarea id="myjquery" style="width: 510px; height: 250px; padding: 2px;">..</textarea></p>
<p><input id="mybtn2" style="position: relative; left: 349px;" type="button" value="统计所有字符串出现次数" /></p>
<div id="myshow2" style="width: 500px; height: 250px; border: 1px dotted #8B8D72; overflow: auto; padding: 5px;"> </div>
<p> </p>
<p><label for="myinput">字符串：<input id="myinput" type="text" /> <input id="mybtn1" style="position: relative; left: 130px;" type="button" value="统计单个字符串出现次数"
/> </label></p>
<div id="myshow1" style="width: 500px; height: 100px; border: 1px dotted #8B8D72; overflow: auto; padding: 5px;"> </div>
<p> </p>
<p>点击“统计所有字符出现次数”按钮后发现，字符串“string”竟然出现了44次，多数是诸如以下的代码</p>
<div class="cnblogs_Highlighter">
<pre class="brush:javascript;gutter:true;">typeof selector === "string"
typeof data !== "string"
type === "string"
typeof context === "string"
getByName = typeof name === "string"
// ...
</pre>
</div>
<p> </p>
<p>如果使用一个变量替换，使用工具压缩时将会进一步减少文件的大小。</p>
<p> </p>
<p> </p>
<script type="text/javascript">// <![CDATA[
setTimeout(function(){
function buildRe(keywords) {
var rObj = {};
if (keywords.constructor !== Array) {
return;
}
keywords.forEach(function(it) {
rObj[it] = RegExp(''+it, 'g');
});
return rObj;
}
function count(rObj, source, callback, sortType) {
var r,
rarr,
num,
type,
func,
result = [];
var subCount = function(arr) {
var i, re, num, resu;
i = num = 0;
for (i; i<arr.length; i++) {
re = arr[i];
while( (resu=re.exec(source)) != null ) {
num++;
}
}
return num;
};
for (type in rObj) {
rarr = rObj[type];
if (rarr.constructor !== Array) {
rarr = [rarr];
}
num = subCount(rarr);
result.push({type: type, num: num});
}
// sort 0:次数顺序 1:次数倒序
if (typeof sortType !== 'undefined') {
if (sortType===0) {
func = function(a, b) {
return a.num - b.num;
};
} else if (sortType===1) {
func = function(a, b) {
return b.num - a.num;
};
}
result.sort(func);
}
callback(result);
}
function main(keywords, source, callback, sortType) {
var rObj = keywords.constructor === Array ? buildRe(keywords) : keywords;
count(rObj, source, callback, sortType);
}
var rObj = {
string: [/\'string\'/g, /\"string\"/g],
number: [/\'number\'/g, /\"number\"/g],
'boolean': [/\'boolean\'/g, /\"boolean\"/g],
object: [/\'object\'/g, /\"object\"/g],
'undefined': [/\'undefined\'/g, /\"undefined\"/g],
'function': [/\'function\'/g, /\"function\"/g],
'array': [/\'array\'/g, /\"array\"/g],
'ready': [/\'ready\'/g, /\"ready\"/g],
input: [/\'input\'/g, /\"input\"/g],
type: [/\'type\'/g, /\"type\"/g],
text: [/\'text\'/g, /\"text\"/g],
radio: [/\'radio\'/g, /\"radio\"/g],
checkbox: [/\'checkbox\'/g, /\"checkbox\"/g],
password: [/\'password\'/g, /\"password\"/g],
submit: [/\'submit\'/g, /\"submit\"/g],
button: [/\'button\'/g, /\"button\"/g],
id: [/\'id\'/g, /\"id\"/g],
div: [/\'div\'/g, /\"div\"/g],
body: [/\'body\'/g, /\"body\"/g],
html: [/\'html\'/g, /\"html\"/g],
HTML: [/\'HTML\'/g, /\"HTML\"/g],
parentNode: [/\'parentNode\'/g, /\"parentNode\"/g],
nextSibling: [/\'nextSibling\'/g, /\"nextSibling\"/g],
iframe: [/\'iframe\'/g, /\"iframe\"/g],
before: [/\'before\'/g, /\"before\"/g],
after: [/\'after\'/g, /\"after\"/g],
script: [/\'script\'/g, /\"script\"/g],
width: [/\'width\'/g, /\"width\"/g],
height: [/\'height\'/g, /\"height\"/g],
top: [/\'top\'/g, /\"top\"/g],
left: [/\'left\'/g, /\"left\"/g],
absolute: [/\'absolute\'/g, /\"absolute\"/g],
relative: [/\'relative\'/g, /\"relative\"/g],
'static': [/\'static\'/g, /\"static\"/g],
fixed: [/\'fixed\'/g, /\"fixed\"/g],
href: [/\'href\'/g, /\"href\"/g],
border: [/\'border\'/g, /\"border\"/g],
margin: [/\'margin\'/g, /\"margin\"/g],
marginTop: [/\'marginTop\'/g, /\"marginTop\"/g],
marginBottom: [/\'marginBottom\'/g, /\"marginBottom\"/g],
marginLeft: [/\'marginLeft\'/g, /\"marginLeft\"/g],
marginRight: [/\'marginRight\'/g, /\"marginRight\"/g],
padding: [/\'padding\'/g, /\"padding\"/g],
paddingTop: [/\'paddingTop\'/g, /\"paddingTop\"/g],
paddingLeft: [/\'paddingLeft\'/g, /\"paddingLeft\"/g],
paddingRight: [/\'paddingRight\'/g, /\"paddingRight\"/g],
display: [/\'display\'/g, /\"display\"/g],
olddisplay: [/\'olddisplay\'/g, /\"olddisplay\"/g],
none: [/\'none\'/g, /\"none\"/g],
hidden: [/\'hidden\'/g, /\"hidden\"/g],
inline: [/\'inline\'/g, /\"inline\"/g],
opacity: [/\'opacity\'/g, /\"opacity\"/g],
show: [/\'show\'/g, /\"show\"/g],
hide: [/\'hide\'/g, /\"hide\"/g],
toggle: [/\'toggle\'/g, /\"toggle\"/g],
json: [/\'json\'/g, /\"json\"/g],
success: [/\'success\'/g, /\"success\"/g],
fxshow: [/\'fxshow\'/g, /\"fxshow\"/g],
fx: [/\'fx\'/g, /\"fx\"/g],
'.run': [/\'.run\'/g, /\".run\"/g],
'http:': [/\'http:\'/g, /\"http:\"/g],
error: [/\'error\'/g, /\"error\"/g],
abort: [/\'abort\'/g, /\"abort\"/g],
GET: [/\'GET\'/g, /\"GET\"/g],
POST: [/\'POST\'/g, /\"POST\"/g],
get: [/\'get\'/g, /\"get\"/g],
filter: [/\'filter\'/g, /\"filter\"/g],
px: [/\'px\'/g, /\"px\"/g]
};
function callback1(result) {
var obj = result[0];
var myshowEL = $('#myshow1');
myshowEL = myshowEL.empty();
myshowEL.append('<div>' + obj.type + ': <span style="color: blue;">' + obj.num + '</span></div>');
}
function callback2(result) {
var myshowEL = $('#myshow2');
myshowEL = myshowEL.empty();
for (var i=0; i<result.length; i++) {
var obj = result[i];
myshowEL.append('<div>"' + obj.type + '": <span style="color: blue;">' + obj.num + '</span></div>');
}
}
$('#mybtn1').click(function(){
var $txtarea = $('#myjquery');
var source = $txtarea.val();
var val = $('#myinput').val();
if (val == '' || val.length<2) {
alert('至少两个字符');
return;
}
var keywords = [val];
main(keywords, source, callback1, 1)
});
$('#mybtn2').click(function(){
var $txtarea = $('#myjquery');
var source = $txtarea.val();
main(rObj, source, callback2, 1);
});
}, 1000);
// ]]></script>
</body>
</html>