如何用滑脂猴子修改CDATA？

Question

有一个网页具有使用Javascript制作的所有HTML结构。 例：

<script language="JavaScript" type="text/javascript">
//<![CDATA[
function abcd()
{
document.writeln('<div id="abc">');
document.writeln('<div class="Wrapper">');
document.writeln('Test');
...
}
</script>

我想做的是用<b>Test</b>代替Test一词的所有实例，但是我不确定我该如何用它来制作元素/ HTML。

Answer 1

您要包装Test ，并且有问题的HTML由javascript添加。 如果是这样，则有三种基本方法：

1. 您可以只包装目标单词出现的样子。 这是最可靠的方法。 有关更多详细信息，请参见下文。

2. 您以后经常可以重写有问题的javascript函数。 例如：

    // ==UserScript== // @name YOUR_SCRIPT_NAME // @include http://YOUR_SERVER.COM/YOUR_PATH/* // ==/UserScript== function abcd () { document.writeln('<div id="abc">'); document.writeln('<div class="Wrapper">'); document.writeln('<b>Test</b>'); ... } var D = document; var scriptNode = D.createElement ('script'); scriptNode.type = "text/javascript"; scriptNode.textContent = abcd; var targ = D.getElementsByTagName('head')[0] || D.body || D.documentElement; targ.appendChild (scriptNode); 

   
   将会在运行之前替换邪恶版本的abcd () 。

3. 您可以尝试在该<script>节点加载之后和执行之前对其进行拦截（一旦脚本运行，更改源将无效）。

   Firefox可以做到这一点，有关此功能的Greasemonkey代码，请参见此答案 。 不过，在这种情况下，我不建议您使用这种方法。

CDATA不是所有这些方法的因素。

---

---

包装目标文本，如下所示：

1. 使用waitForKeyElements（）实用程序捕获感兴趣的节点，使它们出现。 无需分析页面的javascript或担心页面更改可能会破坏某些内容。

2. 使用常见的DOM方法包装目标文本，而不会破坏HTML或破坏事件侦听器。 在这种情况下，它是wrapTextWithElement对象。

3. jQuery使一切变得更加轻松，清晰。

这是一个完整的脚本 。 您也可以在此演示页面上对其进行测试。

// ==UserScript==
// @name     YOUR_SCRIPT_NAME
// @include  http://fiddle.jshell.net/gH4nV/*
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==
/*- The @grant directive is needed to work around a design change introduced
    in GM 1.0.   It restores the sandbox.
*/

waitForKeyElements ("div.Wrapper", emboldenTheWordTest);

function emboldenTheWordTest (jNode) {
    var testWrapper = new wrapTextWithElement ('Test', '<b>');
    testWrapper.wrap (jNode);
}

function wrapTextWithElement (targText, elemToWrapWith, bCaseSensitive) {
    var self            = this;
    var bCaseSensitive  = bCaseSensitive || false;
    self.targRegEx      = new RegExp ("(" + targText + ")", bCaseSensitive ? "" : "i");
    self.elemToWrapWith = elemToWrapWith;

    self.wrap = function (node) {
        $(node).contents ().each ( function () {
            if (this.nodeType === Node.ELEMENT_NODE) {
                self.wrap (this);
            }
            else if (this.nodeType === Node.TEXT_NODE) {
                var ndText  = this.nodeValue;

                if (self.targRegEx.test (ndText) ) {
                    var replaceNodes = $.map (
                        ndText.split (self.targRegEx),
                        function (phrase) {
                            if (self.targRegEx.test (phrase) ) {
                                var wrapped = $(self.elemToWrapWith, {text: phrase} );

                                return wrapped.get ();
                            }
                            else {
                                if (phrase == "")
                                    return null;
                                else
                                    return document.createTextNode (phrase)
                            }
                        }
                    );
                    $(this).replaceWith (replaceNodes);
                }
            }
        } );
    };
}