The following questions are confusing me. I know they are related, but…
- Is HTML 5 namespace aware (for including tags of SVG/other XML dialects)?
- If it is not, then what about this –
I have read this old link, but I am totally confused… because Mozilla says “to dynamically modify inline SVG, scripting needs to be done this way” – so finally, how can I dynamically modify inline SVG (if HTML 5 is not namespace aware)?
- Or the page needs to be served as (X)HTML 5?
Details –
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>hello-SVG</title>
</head>
<body>
<svg width="200" height="200">
<rect x="0" y="0" width="100" height="100" fill="blue"></rect>
</svg>
</body>
</html>
The above code is the correct way to render a rect (using SVG) in HTML 5. Now, to modify the SVG using JavaScript, Mozilla recommends using this API. And my question is, what is the point of doing so if HTML 5 is not namespace aware? For such cases do browsers automatically switch to (X)HTML 5?
I read this comment on SO, and I find it closest to the answer I’m looking for –
I guess the HTML 5 SVG situation is basically “SVG without a namespace gets the namespace added during parsing (but after that it’s just like (X)HTML before)”.
Advertisement
Answer
HTML5 defines HTML, XHTML and the DOM.
The DOM is namespace aware. When you use DOM methods you must take into account which namespace each element is in, but the default is the HTML (http://www.w3.org/1999/xhtml) namespace.
HTML and XHTML are serializations that are converted into DOMs by parsing.
XHTML is namespace aware and XHTML documents apply namespaces according to the rules of XML, so all namespaces must be assigned to each element explicitly. XHTML is converted to a DOM using an XML parser.
HTML is also namespace aware, but namespaces are assigned implicitly. HTML is converted to a DOM using an HTML parser, which knows which elements go in which namespace. That is, it knows that <div> goes in the http://www.w3.org/1999/xhtml namespace and that <svg> goes in the http://www.w3.org/2000/svg namespace. Elements like <script> can go in either the http://www.w3.org/1999/xhtml or the http://www.w3.org/2000/svg namespace depending on the context in which they appear in the HTML code.
The HTML parser knows about HTML elements, SVG elements, and MathML elements and no others. There is no option to use elements from other namespaces, neither implicitly nor explicitly. That is, xmlns attributes have no effect.