有没有办法只替换页面上所有元素的innerText?

时间:2015-02-12 21:25:33

标签: javascript html innerhtml innertext

背景

基于today's XKCD我创建了以下脚本:

javascript:var a=document.getElementsByTagName('body')[0].innerHTML;a=a.replace(/Program(\w\w+)*/gmi,'curse').replace(/language/gmi,'word');

如果您访问某个网站(例如http://en.wikipedia.org/wiki/Programming_language)并粘贴上述代码(如果需要,重新添加javascript:),则会对文档的内容执行正则表达式替换,同时保留大多数格式,创造一些有趣的阅读。

然而,该网站的外观受到影响;大概是因为我正在替换innerHTML而不仅仅是innerText(我猜;虽然不确定)。

我不能简单地替换innerText,因为所有元素都包含了他们自己的孩子的innerText;在body元素上执行此操作将删除所有格式,并且在每个元素上执行此操作将复制大量内容。

问题

有没有办法通过(最小)javascript迭代HTML文档中的所有节点,替换其直接子文本值中的单词,同时保留其剩余内容?

1 个答案:

答案 0 :(得分:1)

您拥有的Javascript根本不会更改页面。它将正文的内容读入字符串,然后更改字符串。这不会影响内容。

页面更改的原因是脚本的值是字符串的值,因此用作新页面的内容。由于这只是一个没有head标签的HTML片段,其中定义了所有样式和脚本,因此您只能获得包含内容的无样式页面。

如果要更改页面,则应将字符串作为内容放回正文中,然后使用void(0);作为最后一个语句以防止创建新页面:

javascript:var a=document.getElementsByTagName('body')[0].innerHTML;a=a.replace(/Program(\w\w+)*/gmi,'curse').replace(/language/gmi,'word');document.getElementsByTagName('body')[0].innerHTML=a;void(0);