I am rendering this line of code in a <pre> tag to display as normal text on screen:

<img src="http://maps.googleapis.com/maps/api/staticmap?zoom=7&size=700x540&sensor=false$center=London, England&markers=London, England|Leicester, England|">

however it is being misrendered in multiple browsers as:

<img src="http://maps.googleapis.com/maps/api/staticmap?zoom=7&size=700x540&sensor=false¢er=London, England&markers=London, England|Leicester, England|">

Since the escape code for a cent symbol is &cent; and not &cent, I cannot see why this is happening and there doesn't seem to be any way to prevent it. Can anyone help?

Also, my doctype:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

If it makes any difference, this line of code is being added to the document by Javascript's innerHTML method.

有帮助吗?

解决方案

Just because something is in a <pre> doesn't mean you don't have to escape it (doctype makes no difference here). Any instance of & should use the entity &amp; if you want & to be displayed on screen. You can get away without it sometimes, but that's just the browser being forgiving - you shouldn't take advantage of it. The browser may try to convert to an entity if it recognizes one, even if the semicolon is missing (being forgiving again).

The whole thing (source) should be:

<pre>&lt;img src=&quot;http://maps.googleapis.com/maps/api/staticmap?zoom=7&amp;size=700x540&amp;sensor=false&amp;center=London, England&amp;markers=London, England|Leicester, England|&quot;&gt;</pre>

By the way, this is true for attribute values too, like href. It's common for people to be "lazy" and not escape the ampersands in query strings, but you really should.

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top