How to replace HTML entity by the string character

Question

I have a string with multiple different HTML characters in it.
For example:

var price = "CHF 150.– (brutto)";

how can I replace the HTML entities like – with the string character like below?

"CHF 150.- (brutto)";

Answer 1

function replaceHTMLEntities(str) {
  const htmlEntities = {
    '&': '&',
    '&lt;': '<',
    '&gt;': '>',
    '&quot;': '"',
    '&#039;': "'",
    '&ndash;': '-',
  };

  return str.replace(/&[\w#]+;/g, entity => {
    return htmlEntities[entity] || entity;
  });
}

Answer 2

You can use the method replace() like so:

price.replace('&ndash', '-');

MDN Web Docs - String.prototype.replace()

Answer 3

You could decode it using the native DOMParser.

I created a wrapper class that can be reused:

// Based on: https://stackoverflow.com/a/34064434/1762224
class HTMLDecoder {
  constructor() {
    this.parser = new DOMParser();
  }
  decode(input) {
    const doc = this.parser.parseFromString(input, 'text/html');
    return doc.documentElement.textContent;
  }
}

const decoder = new HTMLDecoder(),
      price   = "CHF 150.– (brutto)";

console.log(decoder.decode(price));

console.log(decoder.decode('© 2023 "Hello World"'));