我想使用Greasemonkey为Firefox做一个 Greentext 插件,但没有jQuery。
这就是我的所作所为:
<head>
<script type="text/javascript">
function highlight() {
var elm = document.getElementsByClassName("mainWrapper");
for(i = 0; i < elm.length; i++)
{
elm[i].innerHTML.replace(">","pony");
}
}
alert("PONY");
</script>
</head>
<body onload="highlight()">
<div class="mainWrapper"><span class="noob"> > N00b </span>
</div>
</body>
这是该函数的测试版本,我这样做是因为我认为问题是Greasemonkey,但它还没有用。
你能帮帮我吗?我不擅长编程,我不知道如何在JS上编写脚本。答案 0 :(得分:2)
对于类似的东西,你只需要处理页面的文本部分 - 这样就不会破坏HTML(以及任何附加的JS)。
所以(1)不要使用innerHTML
,(2)代码最好使用一种名为recursion的技术来有效地解析节点。
另请注意, &gt; 可以编码为>
或>
(也可能是一些罕见的方法)。
这是一个完整的Greasemonkey脚本,可以进行这种搜索和替换:
// ==UserScript==
// @name _Replace HTML-sensitive text
// @include http://YOUR_SERVER.COM/YOUR_PATH/*
// @include http://fiddle.jshell.net/DJLEq/*
// @grant none
// ==/UserScript==
var targElements = document.querySelectorAll ("div.mainWrapper");
for (var J = targElements.length - 1; J >= 0; --J) {
repGreaterWithPonies (targElements[J] );
}
function repGreaterWithPonies (node) {
if (node.nodeType === Node.TEXT_NODE) {
// YOUR CUSTOM REPLACE GOES HERE.
node.nodeValue = node.nodeValue.replace (/>|>/ig, "pony");
}
else if (node.nodeType === Node.ELEMENT_NODE) {
for (var K = 0, numNodes = node.childNodes.length; K < numNodes; ++K) {
repGreaterWithPonies (node.childNodes[K] );
}
}
}
安装该脚本和you can see it work on this page: fiddle.jshell.net/DJLEq/...
答案 1 :(得分:0)
在这个问题上并不完全清楚,但看看你的代码看起来像你想做的事情:
<head>
<script type="text/javascript">
function highlight() {
var elm = document.getElementsByClassName("mainWrapper");
for(i = 0; i < elm.length; i++)
{
elm[i].innerText = elm[i].innerText.replace(">","pony");
}
}
</script>
</head>
<body onload="highlight()">
<div class="mainWrapper">><span class="noob"> N00b </span>
</div>
</body>
<强> EXAMPLE 强>