Removing duplicate words in html element text?

Question

I have a small problem with replace words in html.

<p id ="demo">Hello, Hello how are you! </p>

I want final result like this: Hello, how are you!

It should to filter it to remove duplicate items, join them back.

var span = document.getElementById('demo'),
    text = span.innerHTML.split('').filter(function (allItems,i,p) {
   return i == p.indexOf(allItems);
    }).join('');
    
    span.innerHTML = text;

<p id ="demo">Hello, Hello how are you </p>

You only want words removed and not duplicate letters, right? — mdatsev, Jan 10 '18 at 17:57
https://stackoverflow.com/questions/16843991/remove-occurrences-of-duplicate-words-in-a-string — Danny, Jan 10 '18 at 18:05
Hello, and Hello are different since there is comma involved. Is it the only string you want to change or there can be many like this ? — pixlboy, Jan 10 '18 at 18:11

score 2 · Accepted Answer · answered Jan 10 '18 at 18:06

This should work:

var span = document.getElementById('demo'),
  text = span.innerHTML.split(/(\W+)/).map(function(currValue, i, array) {
    if (i == array.indexOf(currValue) || i % 2)
      return currValue;
    return '';
  }).join('');

span.innerHTML = text;

<p id="demo">Hello, Hello how are you! </p>

It splits by any sequence of non-word characters and then maps the array and if the item is repeated it returns empty string, else the item. I also save the separators so they can be recovered later - thus the check i % 2 ( if it is a separator always return it - we don't want to filter them).

score 1 · Answer 2 · answered Jan 10 '18 at 18:29

You can capture each word, and if the word has not been found yet, add it to a list of unique items. If the word is found, replace it.

function dedupe(string) {
  var unique = [];
  return string
    .replace(/[a-z]+/gi, function(m) {
      if (unique.indexOf(m) < 0) {
        unique.push(m);
        return m;
      }
      return '';
    })
    .replace(/\s+/, ' ');
}

let fixed = dedupe('Hello, Hello how are you!');

console.log(fixed);

Removing duplicate words in html element text?

2 Answers2