CODEWITHSUNDEEP
htmlsvg
arv100kri
arv100kri

Reputation: 99

SVG in HTML with a script element

I have an inline SVG code inside a HTML page,

<body>
<div style="width:1000px;height:1000px">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" id="svgcanvas" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="viewport">
<circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red"/>
<script xlink:href="js/SVGPan.js" type="text/javascript"/>
</svg>

The script is invoked correctly in Firefox 7.0, but not in Chrome 16.0. Why is this so? And what modifications should I make in the code to invoke the javascript in Chrome too?

Upvotes: 6

Views: 1670

Answers (2)

Alohci
Alohci

Reputation: 83125

Interesting question.

Some things to note.

Inside normal HTML, <script ... /> would not be self closing and anything that followed would be part of the contents of the script element.

Inside the <svg> element, <script ... /> is self closing and forms an entire element.

Both Firefox and Chrome get this right.

However, the HTML5 spec says that the script should only be processed when the parser encounters the end tag. Since the element doesn't have an end tag, then, the script should not be processed. This is what Chrome does.

The SVG spec however, requires the script to be run once the element has been closed by any means, not just on an end tag. This is what Firefox does.

IMHO, the HTML5 spec is wrong, and should specify behaviour consistent with SVG.

UPDATE: 10 Aug 2012.

The HTML5 spec (currently WHATWG version only) has been changed so that the SVG script should be run. See https://www.w3.org/Bugs/Public/show_bug.cgi?id=17995

UPDATE: 16 Sep 2012.

The W3C version of the HTML5 spec has now also been corrected.

Upvotes: 8

Emil Stenstr&#246;m
Emil Stenstr&#246;m

Reputation: 14126

Try <script></script> instead of <script/>, I've had problems with this before.

Upvotes: 5

Related Questions