4

Como posso fazer um filtro de palavras em Javascript? Por exemplo, tenho uma div e dentro dessa div não quero que existam determinadas palavras que estão dentro de um array:

var badWords = ['teste', 'teste1', 'oteste2'];

Como faço para verificar se essas palavras existem no texto e substituir seu conteúdo de maneira que a primeira letra dessa palavra apareça, mas o restante fique com asteriscos?

Por exemplo:

<div>Este texto tem as palavras: teste, teste1 e oteste2, e eu quero filtrar as palavras teste, oteste1 e teste2</div>

O conteúdo acima seria substituído por algo assim:

<div>Este texto tem as palavras: t****, t***** e o******, e eu quero filtrar as palavras t****, t***** e o******</div>

Lembrando que não posso usar jQuery, precisaria ser em Javascript puro justamente porque não justifica usar a biblioteca completa só para fazer isso...

5
  • O que você tentou até agora? Commented 9/07/2014 às 17:39
  • @Beterraba Esse é o problema eu não sou experiente com Javascript, portanto tudo que tentei não resultou. O máximo que consegui foi encontrar o index dessas palavras, veja: pastebin.com/5tvXRj1c Todos os outros testes falharam... Tentei .replace(), e outros...
    – waghcwb
    Commented 9/07/2014 às 17:53
  • Cara, estes textos são gerados como? em qual linguagem? Vem de um banco de dados? EU não usaria javascript para isto, se estiver desabilitado no navegador, já era seu filtro. Commented 9/07/2014 às 17:59
  • Os textos vem de uma página HTML comum amigo.. Nenhum banco de dados.
    – waghcwb
    Commented 9/07/2014 às 18:01
  • Mas e porque escrever palavras em HTML que serão filtradas? Não seria mais fácil não escrever o que não pode? Commented 9/07/2014 às 18:04

2 Respostas 2

6

Vou deixar você se virar pra pegar a div e trocar a propriedade innerHtml ou innerText dela, já que você não quer usar jQuery.

De resto:

var badWords = { // Isso vai ser nosso dicionário.
    "teste": "t****",
    "teste1": "t*****",
    "oteste2": "o******",
    "Supercaligrafilistiespialidocio": "S******************************"
    /* etc, etc...*/
}

function changeWords (input) {
    var text = input.split(" "); // Isso pega a string de input e quebra em palavras separadas por espaços;
    for (var i = 0; i < text.length; i++) {
        var word = text[i];
        if (badWords[word]) { // Essa é a sintaxe pra ver se algo está no dicionário
            text[i] = badWords[word];
        }
    }
    return text.join(" "); // Isso junta todas as palavras num texto de novo, separadas por espaços.
}
1
  • 1
    MaryPoppinsMention++;
    – OnoSendai
    Commented 9/07/2014 às 18:17
5

Você pode usar RegExp:

var arr = ['teste', 'teste1', 'oteste2'];
var f = document.querySelector('div').textContent;

arr.forEach(function(el, index, arr) {
    var regexp = new RegExp("\\b(" + el + ")\\b", "g");
    f = f.replace(regexp, el.substr(0,1) + el.substring(1).replace(/./g, "*"));
});

document.querySelector('div').textContent = f;

Fiddle

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .