<?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"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<head>
</head>
<body>
<svg:svg version="1.1"
font-family="Courier New"
font-size="14px">
<svg:rect />
</svg:svg>
</body>
</html>
<!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"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<head>
</head>
<body>
<svg:svg version="1.1"
font-family="Courier New"
font-size="14px">
<svg:rect />
</svg:svg>
</body>
</html>
注意这里是xhtml而不是html，如果你希望你的页面能够被Firefox直接渲染，这是必须的。xhtml是xml文档，只是非常像html而已。Firefox的xml解析器和html解析器是不同的，所以如果用html作为这个页面文件的扩展名会导致Firefox直接把源代码显示出来，就像显示一般xml文件一样。
svg dom和html dom没有什么区别，大多数方法也是相同的，所以jQuery在一般情况下也是畅通无阻的。只有一点是需要特别注意的，应该使用需要指定命名空间的DOM方法。比如如果需要创建一个svg元素时，应该使用createElementNS而不是createElement。好在这样的DOM方法不多，只有这么几个：
SVG Authoring Guidelines都讲到了。
这就带来一个问题，jQuery是不使用这些结尾是NS的DOM函数的。怎么办呢？笨办法是直接git clone出jQuery的源代码，想把所有相应的函数全部用NS结尾的函数替换并改写，然后重新编译出一个定制版的jQuery给自己用。我怎么知道的呢？因为这种蠢事就是我干的。还好在用脚本替换了这些函数之后我还是意识到了，转而把这些NS结尾的函数包装成jQuery的插件，比如像这样：
svg dom和html dom没有什么区别，大多数方法也是相同的，所以jQuery在一般情况下也是畅通无阻的。只有一点是需要特别注意的，应该使用需要指定命名空间的DOM方法。比如如果需要创建一个svg元素时，应该使用createElementNS而不是createElement。好在这样的DOM方法不多，只有这么几个：
SVG Authoring Guidelines都讲到了。
这就带来一个问题，jQuery是不使用这些结尾是NS的DOM函数的。怎么办呢？笨办法是直接git clone出jQuery的源代码，想把所有相应的函数全部用NS结尾的函数替换并改写，然后重新编译出一个定制版的jQuery给自己用。我怎么知道的呢？因为这种蠢事就是我干的。还好在用脚本替换了这些函数之后我还是意识到了，转而把这些NS结尾的函数包装成jQuery的插件，比如像这样：
//包装hasAttributeNS
jQuery.fn.hasattrns = function(key) {
var ele = this[0];
return ele.hasAttributeNS(null, key);
}
jQuery.fn.hasattrns = function(key) {
var ele = this[0];
return ele.hasAttributeNS(null, key);
}
这样包装完这些函数之后我就可以继续使用jQuery了，这些新函数和jQuery配合的还真不错：）
顺便说两句svg和canvas。从web的角度来看它俩都能在浏览器中创造图形元素，提供更好的用户体验。但从另一个角度来开，<canvas>是html5的一部分，是专门用于增强web页面的；而svg属于xml，它不局限于网页，还可以比如和xul结合起来增强Firefox应用程序本身的使用体验。正像我上面所说的，xml和html是两回事情。不过现在xhtml2的工作组被解散了，xhtml前途未卜，svg在网页之中的表现会如何呢？至少在目前我感觉canvas的应用日见增多，但svg却还是在原地踏步。
