Javascript 基于内容向DOM中的元素添加类

***编辑——问题似乎在我尝试添加类的方式上（我尝试更改一些CSS以供类测试，但它没有做任何事情）

我想基于文本在DOM中找到一个元素，并向其中添加一个类，以便可以操作它/它的父元素

这就是我编写的函数（在此之前，我使用from stackoverflow遍历DOM，并调用我的函数替换匹配项-（实际字符串值现在并不重要）-我正在修改的HTML就是DOM

var MATCH = ['word'];
var REPLACE = ['other'];


   function replaceText(textNode) {
    var badWord = textNode.nodeValue;
    var replaceWord = "";
    badWord.className = "filter";

    //Go through and match/replace strings equal to MATCH
    for (var i=0; i< MATCH.length; i++) {
        replaceWord = document.getElementsByClassName("filter").innerHTML;
        replaceWord = replaceWord.replace(new RegExp('\\b' + MATCH[i] + '\\b', 'g'), REPLACE[i]);
    }
    textNode.nodeValue = replaceWord;
}

---

我更改了您的

replaceText（）

函数，并在此页面上对其进行了测试。它替换了文本，并在节点上用替换的文本添加了一个筛选器类。此解决方案使用

classList.add（'filter'）

，这在IE9及更早版本中不受支持，但这没有问题，因为此代码用于Chrome扩展

function replaceText(textNode) {
    var nodeValue = textNode.nodeValue;
    for (var i=0; i < MATCH.length; i++) {
        if(-1 != nodeValue.indexOf(MATCH[i])) {
            nodeValue = nodeValue.replace(new RegExp(MATCH[i], 'g'), REPLACE[i]);
            textNode.parentNode.classList.add('filter');
        }
    }
    textNode.nodeValue = nodeValue;
}

函数替换文本（textNode）{
var nodeValue=textNode.nodeValue；
对于（变量i=0；i

如果您在nodeValue上使用addClass，这将不起作用，请尝试

textNode.className='filter'；

。如果有多个类“filter”，您可以使用

document.getElementsByClassName（'filter'）

获取它们。要获得完整答案，请使用您试图修改的HTML更新您的帖子，即要替换并使用DOM parse函数链接到stackoverflow post。@M4tini添加了链接-我正在修改当前页面-这是一个chrome扩展Fyi-我必须更改

walk（）

函数中的大小写值以使其工作，例如：

DOCUMENT\u FRAGMENT

到

节点。DOCUMENT\u FRAGMENT\u节点

。

walk(document.body);

function walk(node) {

    var child, next;

    switch (node.nodeType) {
        case ELEMENT:  // Element
        case DOCUMENT:  // Document
        case DOCUMENT_FRAGMENT: // Document fragment
            child = node.firstChild;
            while (child) {
                next = child.nextSibling;
                walk(child);
                child = next;
            }
            break;

        case TEXT: // Text node
            replaceText(node);
            break;
    }
}

function replaceText(textNode) {
    var nodeValue = textNode.nodeValue;
    for (var i=0; i < MATCH.length; i++) {
        if(-1 != nodeValue.indexOf(MATCH[i])) {
            nodeValue = nodeValue.replace(new RegExp(MATCH[i], 'g'), REPLACE[i]);
            textNode.parentNode.classList.add('filter');
        }
    }
    textNode.nodeValue = nodeValue;
}