我有一组字符串,我需要查找HTML文档中的所有事件。字符串发生的位置很重要,因为我需要以不同的方式处理每一种情况:
<input value="foo"> ->添加类ATTR是元素的全文。例如,element.<button>foo</button> ->添加类文本在元素的文本中是内联的。例如,<p>I love foo</p> ->用类文本将文本封装在span标记中.另外,我需要首先匹配最长的字符串。如果我有foo和foobar,那么<p>I love foobar</p>应该变成<p>I love <span class="TEXT">foobar</span></p>,而不是<p>I love <span class="TEXT">foo</span>bar</p>。
内联文本非常简单:按长度排序字符串,并在document.body.innerHTML中查找每个字符串并用<span class="TEXT">$1</span>替换它们,尽管我不确定这是否是最有效的方法。
对于这些属性,我可以这样做:
sortedStrings.each(function(it) {
document.body.innerHTML.replace(new RegExp('(\S+?)="[^"]*'+escapeRegExChars(it)+'[^"]*"','g'),function(s,attr) {
$('[+attr+'*='+it+']').addClass('ATTR');
});
});再一次,这似乎没有效率。
最后,对于全文元素,对比较innerHTML和每个字符串的文档进行深度优先搜索是可行的,但是对于大量字符串来说,它似乎效率很低。
任何提供性能改进的答案都会获得更高的选票:)
编辑:我修改了鲍勃的答案。delim是字符串周围的一个可选分隔符(用于区分它与普通文本),而keys是字符串列表。
function dfs(iterator,scope) {
scope = scope || document.body;
$(scope).children().each(function() {
return dfs(iterator,this);
});
return iterator.call(scope);
}
var escapeChars = /['\/.*+?|()[\]{}\\]/g;
function safe(text) {
return text.replace(escapeChars, '\\$1');
}
function eachKey(iterator) {
var key, lit, i, len, exp;
for(i = 0, len = keys.length; i < len; i++) {
key = keys[i].trim();
lit = (delim + key + delim);
exp = new RegExp(delim + '(' + safe(key) + ')' + delim,'g');
iterator(key,lit,exp);
}
}
$(function() {
keys = keys.sort(function(a,b) {
return b.length - a.length;
});
dfs(function() {
var a, attr, html, val, el = $(this);
eachKey(function(key,lit,exp) {
// check attributes
for(a in el[0].attributes) {
attr = el[0].attributes[a].nodeName;
val = el.attr(attr);
if(exp.test(val)) {
el.addClass(attrClass);
el.attr(attr,val.replace(exp,"$1"));
}
}
// check all content
html = el.html().trim();
if(html === lit) {
el.addClass(theClass);
el.html(key); // remove delims
} else if(exp.test(html)) {
// check partial content
el.html(html.replace(exp,wrapper));
}
});
});
});假设遍历是最昂贵的操作,这似乎是最优的,尽管改进仍然是受欢迎的。
发布于 2010-04-23 16:18:14
没有什么好办法来做这件事。您的最后一个需求使您必须遍历整个区域。
对于前两个需求,我将按标记名称选择所有元素,并在它们之上插入所需的内容。
只有我能想到的性能改进是不惜一切代价在服务器端做这件事,这甚至可能意味着额外的帖子让你的更快的服务器来完成这项工作,否则这可能会非常慢,比如说,IE6。
https://stackoverflow.com/questions/2700120
复制相似问题