使用JavaScript替换“>”文本

时间:2012-10-23 19:23:02

标签: javascript text greasemonkey

我想使用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上编写脚本。

2 个答案:

答案 0 :(得分:2)

对于类似的东西,你只需要处理页面的文本部分 - 这样就不会破坏HTML(以及任何附加的JS)。

所以(1)不要使用innerHTML,(2)代码最好使用一种名为recursion的技术来有效地解析节点。

另请注意, &gt; 可以编码为>&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 (/>|&gt;/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