2

在网页的正文区域是唯一可访问部分的情况下,有没有办法使用内联 JavaScript 或其他支持内联的语言删除特定文本短语(用 HTML 编写)的所有实例?

这在许多情况下可能很有用,例如人们使用 Tiny.cc/customurl 并希望删除说明“tiny.cc/”的部分


如果允许具体细节,我们将使用 Tiny.cc 修改日历插件以创建自定义 URL (tiny.cc/customurl)。该插件默认显示完整的 URL,因此我们想去除文本“tiny.cc/”并在我们的代码中保留“customurl”部分:

<div class="ews_cal_grid_custom_item_3">
  <div class="ews_cal_grid_select_checkbox_clear" id="wGridTagChk" onclick="__doPostBack('wGridTagChk', 'tiny.cc/Baseball-JV');" >&nbsp;</div>
                            tiny.cc/Baseball-JV
  </div>

我们要删除的部分是http://tiny.cc/第 3 行本身。

4

3 回答 3

1

要在不替换所有 HTML(破坏所有事件处理程序)的情况下执行此操作并且不使用递归(通常更快)来执行此操作,您可以这样做:

function removeText(top, txt) {
    var node = top.firstChild, index;
    while(node && node != top) {
        // if text node, check for our text
        if (node.nodeType == 3) {
            // without using regular expressions (to avoid escaping regex chars),
            // replace all copies of this text in this text node
            while ((index = node.nodeValue.indexOf(txt)) != -1) {
                node.nodeValue = node.nodeValue.substr(0, index) + node.nodeValue.substr(index + txt.length);
            }
        }
        if (node.firstChild) {
            // if it has a child node, traverse down into children
            node = node.firstChild;
        } else if (node.nextSibling) {
            // if it has a sibling, go to the next sibling
            node = node.nextSibling;
        } else {
            // go up the parent chain until we find a parent that has a nextSibling
            // so we can keep going
            while ((node = node.parentNode) != top) {
                if (node.nextSibling) {
                    node = node.nextSibling;
                    break;
                }
            }
        }
    }
}​

在这里工作演示:http: //jsfiddle.net/jfriend00/2y9eH/

要对整个文档执行此操作,您只需调用:

removeText(document.body, "http://tiny.cc/Baseball-JV");
于 2012-08-22T17:09:20.187 回答
0

只要您可以提供字符串格式的数据,您就可以使用正则表达式为您执行此操作。

您可以解析 body 标记的整个innerHTML,如果这是您可以访问的全部内容。这是一种缓慢且有点糟糕的做法,但为了解释起见:

document.body.innerHTML = document.body.innerHTML.replace(
    /http:\/\/tiny\.cc\//i,    // The regular expression to search for
    "");                       // Waht to replace with (nothing).

整个表达式包含在正斜杠中,因此正则表达式中的任何正斜杠都需要使用反斜杠进行转义。

这适用于在正则表达式中具有特殊含义的其他字符,例如句点。单个句点 ( .) 表示匹配“任何”字符。要匹配句点,必须对其进行转义 ( \.)

编辑:

如果您希望在 onclick 中保留对 URL 的引用,您可以修改正则表达式以在单引号内不匹配(如您的示例):

/([^']http:\/\/tiny\.cc\/[^'])/i
于 2012-08-22T16:47:44.807 回答
0

如果您不想替换 H​​TML 中该字符串的所有实例,则必须递归地遍历节点结构,例如:

function textFilter(element, search, replacement) {
    for (var i = 0; i < element.childNodes.length; i++) {
        var child = element.childNodes[i];
        var nodeType = child.nodeType;
        if (nodeType == 1) { // element
            textFilter(child, search, replacement);
        } else if (nodeType == 3) { // text node
            child.nodeValue = child.nodeValue.replace(search, replacement);
        }
    }
}

然后您只需抓住适当的元素,并在其上调用此函数:

var el = document.getElementById('target');
textFilter(el, /http:\/\/tiny.cc\//g, "");​  // You could use a regex
textFilter(el, "Baseball", "Basketball");​   //  or just a simple string
于 2012-08-22T16:59:50.877 回答