[RESOLVED] Nested quotes with html and javascript

**aconybeare** · Oct 11th, 2007, 06:52 AM

Hi,

I'm trying to work out how to use nested quotes.

The first link works, but the second fails because of the hilighted apostrophe

Code:

<html>
<head>
	<title>test</title>
</head>
<body>
<div id="grid"></div>
<script type="text/javascript">
	var tableRow = New Array(1);

	tableRow[0] = '<p><a href="#" onclick="alert(\'hello\');return false;">test 1</a></p>';
	tableRow[1] = '<p><a href="#" onclick="alert(\'There\'s no place like home\');return false;">test 2</a></p>';

	var txt = '';
	for(var iLoop = 0; iLoop <= 1; iLoop++){
		txt +=tableRow;
	}
	document.getElementById("grid").innerHTML = txt;
 </script>
</body>
</html>

Any ideas will be greatly appreciated

Cheers Al

**tr333** · Oct 11th, 2007, 08:28 PM

You need to insert an escaped slash character before the original escaped single quote character. The first two single quotes in the alert() method are printed as single quotes in the HTML, so adding a third quote character will mess this up. The extra slash is required to escape the quote when it is all printed into HTML. The javascript code at the bottom gives an alert box containing the HTML that would be printed by the first JS code so you can see where the extra escaped slash is required.

I also removed the for loop as it was unnecessary. the join() method will combine all array elements together with a newline character separating them.

HTML Code:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 
<head>
    <title>test</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
</head>
 
<body>
<div id="grid"></div>
<script type="text/javascript">
    var tableRow = new Array();
 
    tableRow[0] = '<p><a href="#" onclick="alert(\'hello\');">test 0</a></p>';
    tableRow[1] = '<p><a href="#" onclick="alert(\'There\\\'s no place like home\');">test 1</a></p>';
    tableRow[2] = '<p><a href="#" onclick="alert(\'hello2\');">test 2</a></p>';
 
    document.getElementById("grid").innerHTML = tableRow.join("\n");
</script>
 
 
<script type="text/javascript">
    alert(document.getElementById("grid").innerHTML);
</script>
</body>
</html>

**aconybeare** · Oct 12th, 2007, 04:02 AM

tr333,

Thanks very much for your reply, much appreciated.

I'd already tried what you've suggested and it didn't work, so must have been doing something else wrong, anyway if tried it again and it's working, so I'm happy.

Cheers Al

**penagate** · Oct 12th, 2007, 05:41 AM

You really should use the createElement and appendChild methods rather than innerHTML: The latter won't work in an XML document, which you should technically be sending XHTML 1.0 Strict as.

**aconybeare** · Oct 15th, 2007, 02:49 AM

Penagate,

Thanks for the tip, I'll look into it

Cheers Al

**Merri** · Oct 15th, 2007, 04:31 AM

penagate: though practically in the wild, XHTML1 has lost itself to not being a real XML document thanks to the browser support. And they can't change that anymore, if they make a dramatical change in one browser, that'll break tons of sites that use XHTML in the incorrect way. There really is no way to ensure the backwards compatibility of the current sites.

So I believe we won't ever see a browser that handles XHTML1 exactly as it should be. And that is why we keep seeing innerHTML working practise.

(Firefox 1 tried to be different, they ended up restoring the functionality. You just don't want to break thousands of sites only to force usage of a standard better: you only get negative feedback and angry users.)

**penagate** · Oct 15th, 2007, 07:09 AM

Yes, I realise, but createElement/appendChild are superior anyway.

Thread: [RESOLVED] Nested quotes with html and javascript

Thread Tools

Display

[RESOLVED] Nested quotes with html and javascript

Re: Nested quotes with html and javascript

Re: Nested quotes with html and javascript

Re: [RESOLVED] Nested quotes with html and javascript

Re: [RESOLVED] Nested quotes with html and javascript

Re: [RESOLVED] Nested quotes with html and javascript

Re: [RESOLVED] Nested quotes with html and javascript

Posting Permissions