Unescape HTML

Introduction

In this lab, we will explore how to unescape HTML characters using JavaScript. HTML escaping is a common technique used to encode special characters in HTML to prevent cross-site scripting attacks. However, sometimes we need to convert the escaped characters back to their original form. We will learn how to do this by creating a function that unescapes the most common HTML characters.

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("`JavaScript`")) -.-> javascript/BasicConceptsGroup(["`Basic Concepts`"]) javascript/BasicConceptsGroup -.-> javascript/variables("`Variables`") javascript/BasicConceptsGroup -.-> javascript/data_types("`Data Types`") javascript/BasicConceptsGroup -.-> javascript/arith_ops("`Arithmetic Operators`") javascript/BasicConceptsGroup -.-> javascript/comp_ops("`Comparison Operators`") subgraph Lab Skills javascript/variables -.-> lab-28677{{"`Unescape HTML Characters with JavaScript`"}} javascript/data_types -.-> lab-28677{{"`Unescape HTML Characters with JavaScript`"}} javascript/arith_ops -.-> lab-28677{{"`Unescape HTML Characters with JavaScript`"}} javascript/comp_ops -.-> lab-28677{{"`Unescape HTML Characters with JavaScript`"}} end

This function unescapes escaped HTML characters. To use it, follow these steps:

Open the Terminal/SSH.
Type node.
Copy and paste the following code:

const unescapeHTML = (str) =>
  str.replace(
    /&amp;|&lt;|&gt;|&#39;|&quot;/g,
    (tag) =>
      ({
        "&amp;": "&",
        "&lt;": "<",
        "&gt;": ">",
        "&#39;": "'",
        "&quot;": '"'
      })[tag] || tag
  );

Call the unescapeHTML function and pass it a string with escaped characters.
The function will return the unescaped string.

Example usage:

unescapeHTML("&lt;a href=&quot;#&quot;&gt;Me &amp; you&lt;/a&gt;");
// '<a href="#">Me & you</a>'

Summary

Congratulations! You have completed the Unescape HTML lab. You can practice more labs in LabEx to improve your skills.

Unescape HTML Characters with JavaScript

Introduction

Skills Graph

Unescape HTML

Summary

Other JavaScript Tutorials you may like