查找“老”的所有实例的网页,并与“新”,使用JavaScript书签相互替换(Find all in

2019-06-26 16:47发布

我想要做的是取代“老”的所有实例的JS书签或Greasemonkey的脚本与“新”的网页。 我怎样才能做到这一点? 我想的jQuery或其他框架都还好,因为是黑客,包括他们在这两个小书签以及Greasemonkey脚本。

Answer 1:

一个函数,撞防。 意味着的这不会触及任何标签或属性,只有文字。

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].nodeType == Node.TEXT_NODE) {
            var r = new RegExp(a, 'gi');
            nodes[n].textContent = nodes[n].textContent.replace(r, b);
        } else {
            htmlreplace(a, b, nodes[n]);
        }
    }
}

htmlreplace('a', 'r');

小书签版本:

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].nodeType==Node.TEXT_NODE){nodes[n].textContent=nodes[n].textContent.replace(new RegExp(a,'gi'),b);}else{htmlreplace(a,b,nodes[n]);}}}htmlreplace('old','new');


Answer 2:

如果更换的innerHTML,那么你将摧毁你的页面上的任何DOM事件。 尝试遍历文件替换文本:

function newTheOlds(node) {
    node = node || document.body;
    if(node.nodeType == 3) {
        // Text node
        node.nodeValue = node.nodeValue.split('old').join('new');
    } else {
        var nodes = node.childNodes;
        if(nodes) {
            var i = nodes.length;
            while(i--) newTheOlds(nodes[i]);
        }
    }
}

newTheOlds();

分流/加入比做“替换”如果你不需要模式匹配更快。 如果你需要模式匹配,然后使用“替换”和正则表达式:

node.nodeValue = node.nodeValue.replace(/(?:dog|cat)(s?)/, 'buffalo$1');

作为书签:

javascript:function newTheOlds(node){node=node||document.body;if(node.nodeType==3){node.nodeValue=node.nodeValue.split('old').join('new');}else{var nodes=node.childNodes;if(nodes){var i=nodes.length;while(i--)newTheOlds(nodes[i]);}}}newTheOlds();


Answer 3:

对于较旧的浏览器将需要Node.TEXT_NODE更改为3和node.textContent到node.nodeValue; 所以最终的功能应该是:

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].nodeType == 3) { //Node.TEXT_NODE == 3
            var r = new RegExp(a, 'gi');
            nodes[n].nodeValue = nodes[n].nodeValue.replace(r, b);
        } else {
            htmlreplace(a, b, nodes[n]);
        }
    }
}


Answer 4:

简单的线条沿jQuery的工作原理:

`javascript:var a = function(){$("body").html($("body").html().replace(/old/g,'new'));return;}; a();`

没有jQuery的:

`javascript:function a (){document.body.innerHTML=document.body.innerHTML.replace(/old/g, "new" );return;}; a();`

该函数返回什么是非常重要的,所以浏览器不执行的书签之后的任意位置重定向。



Answer 5:

另一种递归方法:

function replaceText(oldText, newText, node){ 
  node = node || document.body; 

  var childs = node.childNodes, i = 0;

  while(node = childs[i]){ 
    if (node.nodeType == Node.TEXT_NODE){ 
      node.textContent = node.textContent.replace(oldText, newText); 
    } else { 
      replaceText(oldText, newText, node); 
    } 
    i++; 
  } 
}

精缩书签:

javascript:function replaceText(ot,nt,n){n=n||document.body;var cs=n.childNodes,i=0;while(n=cs[i]){if(n.nodeType==Node.TEXT_NODE){n.textContent=n.textContent.replace(ot,nt);}else{replaceText(ot,nt,n);};i++;}};replaceText('old','new');


Answer 6:

好吧,我只是巩固了一些伟大的东西,人们在一个答案张贴。

这里是sixthgear的jQuery代码,但(从大G I源的jQuery)制成的便携式和精缩到书签:

javascript:var scrEl=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 htmlreplace(a,b,element){if(!element)element=document.body;var nodes=$(element).contents().each(function(){if(this.nodeType==Node.TEXT_NODE){var r=new RegExp(a,'gi');this.textContent=this.textContent.replace(r,b);}else{htmlreplace(a,b,this);}});}htmlreplace('old','new');

注意“旧”可以是“字符串文字”,或“REG [EE] X”。

其实,现在我想想,sixthgear的是最好的答案,尤其是我的增强功能。 我找不到任何其他的答案中添加过它,使用jQuery实现了令人难以置信的X-浏览器的兼容性。 另外,我太该死的懒惰。 社区维基,享受!



Answer 7:

嘿,你可以试试这个,问题是,它会搜索整个身体所以即使属性和这样得到改变。

javascript:document.body.innerHTML=document.body.innerHTML.replace( /old/g, "new" );


Answer 8:

我想稍微修改这个,以便它提示要搜索的文本,然后将文本,以取代,而当所有的处理完成后,显示一个对话框,让我知道它的完成。

我打算用它那将有任意数量的充满文字文本框( 这是什么,我需要它来搜索并替换 )一个phpMyAdmin的数据库编辑页面上。 此外,文本搜索和替换可能会或可能不会是多行,所以我已在正则表达式中的“m” PARAM,而且,因为我会做搜索/替换可能包含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:',''));

有人有主意吗?



文章来源: Find all instances of 'old' in a webpage and replace each with 'new', using a javascript bookmarklet