简单的javascript查找和替换

是否有一种直接的方法在div中搜索特定字符串并将其替换为另一个字符串? 我不能单独使用.replaceWith,因为我需要保留div中的其他元素。 我试过这里找到的各种javascript方法无济于事。

所以类似于:

$('#foo').find('this string').replaceWith('this other string'); 

对于:

 
Other Element
this string

谢谢。

试试这个:

 var foo = $('#foo').html(); foo = foo.replace('this string', 'this other string'); $('#foo').html(foo); 

小提琴: http : //jsfiddle.net/maniator/w9GzF/

这取代了所有出现的事件:

 var $foo = $('#foo'), fooHtml = $foo.html(); $foo.html(fooHtml.replace(/this string/g, 'this other string')); 

只需使用html()。replace()匹配所有结果元素属性或标记名称。

我也面临这个问题,我的解决方案类似于来自http://james.padolsey.com/javascript/find-and-replace-text-with-javascript/的 findAndReplace()函数,但使用正则表达式获取所有textNode和搜索在他们每个人。

 function epubSearch(query) { var d = document.getElementsByTagName("body")[0]; var re = new RegExp(query, "gi");//pattern for keyword var re0 = new RegExp("[>][^><]*[><]", "gi");//pattern to get textnode d.innerHTML = d.innerHTML.replace(re0, function (text) { // with each textNode, looking for keyword return text.replace(re, "$&"); }); } 

这是我刚刚编写的一个jQuery插件,它为集合提供了safeReplace

 (function($){ $.fn.safeReplace = function ( find, replacement ) { return this.each(function(index, elem) { var queue = [elem], node, i; while (queue.length) { node = queue.shift(); if (node.nodeType === 1) { i = node.childNodes.length; while (i--) { queue[queue.length] = node.childNodes[i]; } } else if (node.nodeType === 3) { node.nodeValue = node.nodeValue.replace( find, replacement ); } } }); }; })(jQuery); 

这是你如何使用它:

 $('#foo').safeReplace( /this string/g, 'something else' ); 

我只在FF 4中进行了测试,并且仅在示例HTML输入上进行了测试 – 建议进行更多测试。

希望这可以帮助!

String.replace()有什么问题; ?

例如

 $("#div").html($("#div").html().replace("search string", "replace string")); 

或爆炸:

 var $divElement = $("#div"); //Find the div to perform replace on var divContent = $divElement.html(); //Get the div's content divContent = divContent.replace("search string", "replace string"); //Perform replace $divElement.html(divContent); //Replace contents of div element. 

这一项与你的术语出现的次数一样多,并且不会杀死任何不应该改变的重要事物(存储在排除数组中)。

用法: findAndReplace('dog','cat', document.getElementById('content'));

 /* js find andreplace Based on http://james.padolsey.com/javascript/find-and-replace-text-with-javascript/ */ function findAndReplace(searchText, replacement, searchNode) { if (!searchText || typeof replacement === 'undefined') { return; } var regex = typeof searchText === 'string' ? new RegExp(searchText, 'g') : searchText, childNodes = (searchNode || document.body).childNodes, cnLength = childNodes.length, excludes = ['html','head','style','link','meta','script','object','iframe']; while (cnLength--) { var currentNode = childNodes[cnLength]; if (currentNode.nodeType === 1 && excludes.indexOf(currentNode.nodeName.toLowerCase() + ',') === -1) { arguments.callee(searchText, replacement, currentNode); } if (currentNode.nodeType !== 3 || !regex.test(currentNode.data) ) { continue; } var parent = currentNode.parentNode, frag = (function(){ var html = currentNode.data.replace(regex, replacement), wrap = document.createElement('div'), frag = document.createDocumentFragment(); wrap.innerHTML = html; while (wrap.firstChild) { frag.appendChild(wrap.firstChild); } return frag; })(); parent.insertBefore(frag, currentNode); parent.removeChild(currentNode); } }