HTML-Entities in JavaScript verwenden

Profile of "Arian Glander"

Dear visitor, welcome to WoltLab Community Forum. If this is your first visit here, please read the Help. It explains in detail how this page works. To use all features of this page, you should consider registering. Please use the registration form, to register here or read more information about the registration process. If you are already registered, please login here.

Arian Glander

Ehemaliger Geschäftsführer
- Register now!
You have to register first, to connect to this user.

Rating:

by Arian Glander, Tuesday, September 1st 2009, 3:17pm

Ich bin heute wieder einmal darüber gestolpert, dass man keine HTML-Entities im Javascript verwenden kann. Wer es nicht glaubt, sollte mal folgendes Beispiel (Doctype und XML-Prolog habe ich mal weggelassen.) probieren:

HTML

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" xml:lang="de"><head>
	<title>test</title>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
	<script type="text/javascript">
		window.onload = function() {
			alert('&quot;test&quot;');
		};
		//]]>
	</script>	
</head>
<body></body>
</html>

Beim Aufruf der Seite wird ein Alert-Popup geöffnet, welches das Wort test in Anführungszeichen enthalten sollte. Leider steht anstelle der Anführungszeichen nur ". Etwas googlen brachte mir einen Workaround. Bei diesem wird ein textarea-Element angelegt. In dieses wird dann über innerHTML der String geschrieben. Dabei werden die Entities korrekt ausgewertet. Danach kann man sich den Inhalt der Textarea über value zurückgeben lassen - mit dem gewünschten Resultat.

HTML

<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" xml:lang="de"><head>
	<title>test</title>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
	
	<script type="text/javascript">
		//<![CDATA[
		function htmlEntityDecode(string) {
			var t = document.createElement("textarea");
			t.innerHTML = string;
			return t.value;
		} 
		window.onload = function() {
			alert(htmlEntityDecode('&quot;test&quot;'));
		};
		//]]>
	</script>
</head>
<body></body>
</html>