用JS替換網頁中的單詞

Question

我正在嘗試制作一個Firefox擴展程序，以過濾出cuss單詞，作為測試，我嘗試過濾掉“ the”一詞並替換為“！@＃$”，但是當我運行它時，什么也沒有發生知道為什么。 有人可以幫忙嗎？ 這是我的代碼：

function replaceText(selector, text, newText, flags) {
  var matcher = new RegExp(text, flags);
  var elems = document.querySelectorAll(selector), i;

  for (i = 0; i < elems.length; i++)
    if (!elems[i].childNodes.length)
      elems[i].innerHTML = elems[i].innerHTML.replace(matcher, newText);
}

var selectorsToUse = ["p", "h1", "h2", "h3", "h4", "h5", "h6", "a", ];
var curseWords= [["the" "!@#$"]]

for(curseRegex = 0; curseRegex < curseWords.length; curseRegex++;)
{
    for(i = 0; i < selectorsToUse.length; i++)
    {
        replaceText(selectorstouse[i], cursewords[curseregex][0],
        curseWords[curseRegex][1], "gi");
    };
};

我順便用了別人的代碼

Answer 1

所有這些代碼似乎比必要的工作還要多。 使用正則表達式嘗試一些更簡單的操作。 例如， /the/ig 。 表達式（在這種情況下僅為單詞）寫在正斜杠之間。 i小寫不區分大小寫，因此“ the”，“ THE”，“ The”和任何其他組合將始終匹配。 小g表示全局，因此您可以在當前字符串中獲取“ the”的所有實例。 如果您想添加更多單詞，只需添加| 加上下一個單詞，例如/the|dog/ig 。 您可以根據需要連續輸入多個單詞。 /the|dog|cow|cat/ig

嘗試這個：

const curses = /the/ig
const filterStr = '!@#$'
const selectors = ['p', 'h1', 'a']

selectors.forEach(selector => {
  const elements = [...document.querySelectorAll(selector)] //convert node list to array
  elements.forEach(el =>
    el.textContent = el.textContent.replace(curses, filterStr))
})

或ES5（如果您願意）：

var curses = /the/ig;
var filterStr = '!@#$';
var selectors = ['p', 'h1', 'a'];

selectors.forEach( function(selector) {
  var elements = document.querySelectorAll(selector);
  elements = Array.prototype.slice.call(elements); //convert node list to array
  elements.forEach( function(el) {
    el.textContent = el.textContent.replace(curses, filterStr);
  })
})

看看這個Codepen可以玩一下。