JS Regex用于<a>?</a>中未包含的单词

时间:2014-05-03 05:39:01

标签: javascript html regex

我正在使用以下j来突出显示html中搜索字符串的内容,但问题是这也会影响url字符串。

var a = new RegExp(keywords, "igm");
container.innerHTML = container.innerHTML.replace(a, "<span style='background:#FF0;'>" + keywords + "</span>");

如果关键字位于网址中,那么该网址将与xxxx.com/<span style='background:#FF0;'>product</span>相关联,这是错误的。

那么有没有办法过滤掉网址中没有的单词?不确定是否有RegExp可以做到这一点。提前谢谢。

1 个答案:

答案 0 :(得分:1)

以下是一段代码,可以满足您的要求:

// prepare the replacement as a function
function do_replacement(node) {
  var a = new RegExp(keywords, "igm");
  node.innerHTML = node.innerHTML.replace(a,
    "<span style='background:#FF0;'>" + keywords + "</span>");
}

// back up the links
var link_backups = new Array();
var link_refs = new Array();
var container_links = container.getElementsByTagName("a");
for (var i = 0; i < container_links.length; i++) {
  var copy = container_links[i].cloneNode(true);
  // the link target (href) is not contained in the link's innerHTML
  // remove this line if you don't want to replace the link's TEXT
  do_replacement(copy);
  link_backups.push(copy);
  link_refs[i] = container_links[i];
}

do_replacement(container);

// restore the backed up links
// (this uses link_refs[] because container_links[] could have changed)
for (var i = 0; i < link_refs.length; i++) {
  container.replaceChild(link_backups[i], link_refs[i]);
}

如果您的keywords与链接的代码名称(<a>)匹配,则可能会失败(例如)何时keywords = "a"

但是,我确定您只会遇到另一个您并不想要替换的HTML代码实例。 JS并没有真正有最好的方法来操纵DOM的文本。例如,更改Node.textContent会终止所有节点的HTML内容。