How to Decode HTML Entities Using Jquery

How to decode HTML entities using jQuery?

Security note: using this answer (preserved in its original form below) may introduce an XSS vulnerability into your application. You should not use this answer. Read lucascaro's answer for an explanation of the vulnerabilities in this answer, and use the approach from either that answer or Mark Amery's answer instead.

Actually, try

var encodedStr = "This is fun & stuff";
var decoded = $("<div/>").html(encodedStr).text();
console.log(decoded);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div/>

HTML Entity Decode

You could try something like:

var Title = $('<textarea />').html("Chris' corner").text();console.log(Title);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Javascript decoding html entities

var text = '<p>name</p><p><span style="font-size:xx-small;">ajde</span></p><p><em>da</em></p>';
var decoded = $('<textarea/>').html(text).text();
alert(decoded);

This sets the innerHTML of a new element (not appended to the page), causing jQuery to decode it into HTML, which is then pulled back out with .text().

Live demo.

jQuery (or JS) decodes HTML character entity in string

How do I prevent jQuery from decoding the HTML entity ' in the .append() operation?

You can't, because it isn't.

jQuery is generating some HTML and then getting the browser to convert it to a DOM. It then appends that DOM fragment to the document DOM that represents the page.

When you examine the DOM using a DOM inspector (or when you use innerHTML to convert it to a string) you are serialising the DOM to HTML. At this point the browser does not know (because it hasn't kept track, because it doesn't need to) if the apostrophe in the DOM came from a literal apostrophe or a character reference for one. The algorithm it uses to decide how to represent the character uses the literal one (there is no point in it using a 5 character code when it can use 1 more readable character instead).

<option value="Joe's Cafe">Joe's Cafe</option> and <option value="Joe's Cafe">Joe's Cafe</option> are two different ways of writing exactly the same thing in HTML. Which you get should not matter.


It may be the same thing in HTML but it is completely different when stored in a database.

It sounds like you want the form to submit the string Joe's Cafe to the server.

<option value="Joe's Cafe">Joe's Cafe</option> would not do that.

That would require: value="Joe&#39;s Cafe"

Now you can achieve that by generating your DOM sanely instead of mashing strings together (because when you mash strings together, characters with special meaning in HTML get treated as having that special meaning).

$('#restaurant').append(
$("<option />").val(elem).text(elem)
);

however your implication is that having raw apostrophes in the data is breaking your SQL.

That means you are vulnerable to SQL injection attacks and that the real solution is to fix this server side.

See How can I prevent SQL-injection in PHP? or look up how to use prepared statements to prevent SQL injection in whatever programming language you are using on server.

How to Decode HTML Entities using Jquery/Javascript AutoComplete

Please choose one of these (but not both)

PHP Solution :

if you want to decode html entities you could first use php's built-in html_​entity_​decode() function in autocomplete.php:

$dname_list = array();
while($row = mysqli_fetch_array($result))
{
$dname_list[] = html_​entity_​decode($row['artist_name']);
}
echo json_encode($dname_list);

JS Solution :

take a look at jQueryUI's doc, you can use this to build your own <li> element, so that would be something like :

$("#artist_name").autocomplete({
source: availableTags,
autoFocus: true,
_renderItem: function(ul, item) {
return $("<li>")
.attr("data-value", item.value)
//no need to unescape here
//because htmlentities will get interpreted
.append($("<a>").html(item.label))
.appendTo(ul);
}
});

jquery decode html entity µ

changed the line

var content = $(this).val(".summary_description").html();

to this:

var content = $(this).val(".summary_description").text();

and it worked like a charm.

What's the right way to decode a string that has special HTML entities in it?

This is my favourite way of decoding HTML characters. The advantage of using this code is that tags are also preserved.

function decodeHtml(html) {
var txt = document.createElement("textarea");
txt.innerHTML = html;
return txt.value;
}

Example: http://jsfiddle.net/k65s3/

Input:

Entity: Bad attempt at XSS:<script>alert('new\nline?')</script><br>

Output:

Entity: Bad attempt at XSS:<script>alert('new\nline?')</script><br>

Decode HTML entities with Regex

See this thread - it has your solution for jQuery that works perfectly:

How to decode HTML entities using jQuery?

var encoded = '<div id="readingPaneContentContainer" class="ClearBoth"  cmp="cmp" ulr="ulr"><a id="rpFocusElt" href="javascript:void(0);" style="height:1px;width:1px;';

var decoded = $("<div/>").html(encoded).text();

Does not use regex.

HTML Entities Displaying Encoded when Cloned with jQuery

You don't need to escape + and × so you can just enter these directly into your function.

The reason the value is blank is because the val property is being reset by this line:

newEntry.find('input').val('');

Here's a working JSFiddle.



Related Topics



Leave a reply



Submit