书签小程序帮助:创建一个查找/替换书签小程序

5

我想稍微修改这个,以便提示输入要搜索的文本,然后是要替换为的文本,并在处理完所有内容后,显示一个对话框让我知道它已完成。

我计划将其用于phpmyadmin数据库编辑页面,该页面将填有任意数量的文本框(这就是我需要在其中搜索和替换的内容)。此外,要搜索和替换的文本可能是多行的,因此我已在正则表达式中添加了“m”参数。另外,由于我将进行包含HTML的搜索/替换,因此它们通常会包含引号/双引号。例如:

搜索:

<img height="76" width="92" src="http://www.gifs.net/Animation11/Hobbies_and_Entertainment/Games_and_Gambling/Slot_machine.gif" /></div>
<div class="rtecenter"> <strong><em><font color="#ff0000">Vegas Baby!<br />
</font></em></strong></div>

也许你可以将代码替换为空白 (只是为了清除所有的代码),或其他的HTML代码。到目前为止,这是我想出来的书签脚本 (JavaScript和书签脚本并不是我经常使用的东西),但它至今还无法正确地查找/替换代码,尽管输入提示功能正常。

javascript:var%20scrEl=document.createElement('script');scrEl.setAttribute('language','javascript');scrEl.setAttribute('type','text/javascript');scrEl.setAttribute('src','http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js');function%20htmlreplace(a,b,element){if(!element)element=document.body;var%20nodes=$(element).contents().each(function(){if(this.nodeType==Node.TEXT_NODE){var%20r=new%20RegExp(a,'gim');this.textContent=this.textContent.replace(r,b);}else{htmlreplace(a,b,this);alert('Done%20processing.');}});}htmlreplace(prompt('Text%20to%20find:',''),prompt('Replace%20with:',''));

有人有什么想法吗?

3个回答

5

这是最直接的将原始函数转换为搜索/替换文本区域和文本输入框而不是HTML的方法。我还在正则表达式中添加了'm',并在结尾处添加了alert('done')。然而,我认为使用'm'可能无法完美解决您的问题,但我可能错了。

function htmlreplace(a, b, element) {
    if (!element) element = document.body;    
    var nodes = element.childNodes;
    for (var n=0; n<nodes.length; n++) {
        if ( nodes[n].type && (nodes[n].type.toLowerCase() == 'textarea' || nodes[n].type.toLowerCase() == 'text') ) {
            var r = new RegExp(a, 'gim');
            nodes[n].value = nodes[n].value.replace(r, b);
        } else {
            htmlreplace(a, b, nodes[n]);
        }
    }
}

htmlreplace(prompt('find'), prompt('replace'));
alert('done');

这是一个书签工具。
javascript:function htmlreplace(a,b,element){if(!element)element=document.body;var nodes=element.childNodes;for(var n=0;n<nodes.length;n++){if(nodes[n].type&&(nodes[n].type.toLowerCase()=='textarea'||nodes[n].type.toLowerCase()=='text')){var r=new RegExp(a,'gim');nodes[n].value=nodes[n].value.replace(r,b)}else{htmlreplace(a,b,nodes[n])}}}htmlreplace(prompt('find'),prompt('replace'));alert('done');

谢谢,我尝试了一下,但是什么也没有发生(提示,但是没有替换)。 - J. Scott Elblein
我刚刚在Firefox上重新测试了一个带有文本区域和文本输入的网页。它可以正常工作。如果你不能正常运行,可能是你没有解释清楚的一些细节。 - DG.
我将您的代码压缩成了书签(删除空格,添加javascript:等):这是它无法工作的屏幕录像。[链接](http://screencast.com/t/imfNn01s)在其中,我首先显示了书签代码,然后尝试使用破折号(-)作为查找字符串,字母“T”作为替换字符串进行查找/替换,同时突出显示该行。第二次我做同样的事情,只是没有突出显示该行,并使用星号。我做错了什么吗?这是在Firefox 15.01中完成的。 - J. Scott Elblein
这是我使用的实际代码:javascript:function%20htmlreplace(a,b,element){if(!element)element=document.body;varnodes=element.childNodes;for(varn=0;n<nodes.length;n++){if(nodes[n].type&&(nodes[n].type.toLowerCase()=='textarea'||nodes[n].type.toLowerCase()=='text')){varr=newRegExp(a,'gim');nodes[n].value=nodes[n].value.replace(r,b);}else{htmlreplace(a,b,nodes[n]);}}}htmlreplace(prompt('查找'),prompt('替换'));alert('完成'); - J. Scott Elblein
1
压缩代码时出现了错误。我已经更新了我的答案,将代码以书签形式呈现。未来,我建议使用这个网站:http://javascriptcompressor.com/ - DG.

2
这对我有用:
javascript:function%20htmlreplace(a,b,element){if(!element)element=document.body;var%20nodes=element.childNodes;for(var%20n=0;n<nodes.length;n++){if(nodes[n].nodeType==Node.TEXT_NODE){nodes[n].textContent=nodes[n].textContent.replace(new%20RegExp(a,'gi'),b);}else{htmlreplace(a,b,nodes[n]);}}}htmlreplace(prompt("Text%20to%20replace:","old"),prompt("Replacement%20text:","new"));

我所做的只是用 prompt() 函数替换了 oldnew。这是一个好的书签工具。


谢谢,我尝试了一下,但是什么也没有发生(提示,但是没有替换)。 - J. Scott Elblein

1

我通过搜索来到这里,上面的内容是错误的(或者至少已经过时了),我费了很大劲更新它,直到它能够正常运行,所以我觉得我应该把它粘贴在这里:

javascript:var count=0;
function htmlreplace(a,b,element){
if(!element)element=document.body;
var nodes=element.childNodes;
for(var n=0;n<nodes.length;n++){
   if(nodes[n].type&&nodes[n].type.toLowerCase()=='textarea'){
      var r=new RegExp(a,'gim');
      if(nodes[n].value.match(r)){
        count++;
      }
      nodes[n].value=nodes[n].value.replace(r,b)
    }
    else if(nodes[n].nodeValue && nodes[n].nodeValue.length > 0){
      var r=new RegExp(a,'gim');
      if(nodes[n].nodeValue.match(r)){
        count++;
      }
      nodes[n].nodeValue=nodes[n].nodeValue.replace(r,b)
    }
    else{
      htmlreplace(a,b,nodes[n])
    }
  }
}
htmlreplace(prompt('find'),prompt('replace'));
alert('replaced '+count+' words.');

(在Chrome中测试) 它有一个单词计数而不是仅仅是“完成”消息。我将其更改为扫描所有textNode元素。 (我想大多数人都不会关心替换页面上的所有文本,但这是我来到这里的用例。)


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接