我正在使用本地HTML5文件 - 它<!DOCTYPE html>位于顶部.我把这样的东西放在里面:
<svg height="2em" width="3em" preserveAspectRatio="none" viewBox="0 0 100 100">
<rect x="0" y="0" width="100" height="100" fill="red"/>
</svg>
(没有命名空间,感谢HTML5!),它在Chrome和FF4测试版中表现出色.
现在我想通过JS创建相同的东西.我正在使用Prototype,所以我写了类似的东西:
var box = new Element('svg', {'width':'3em', 'height':'2em', 'preserveAspectRatio': 'none', 'viewBox': '0 0 100 100'});
box.appendChild(new Element('rect', {fill:'red', x:'0', y:'0', width:'100', height:'100' }));
container.appendChild(box);
我可以在Firebug/DOM检查器(FF和Chrome)中看到它正在为此创建相同的DOM结构.
我看到的唯一区别是属性("preserveAspectRatio"和"viewBox")都是小写的,但我尝试将我的第一个测试(静态HTML)中的属性更改为全小写但它仍然可以正常工作,所以我认为这不是问题所在.
HTML5 SVG功能是否仅限于静态HTML,我还需要通过JS添加SVG内容的命名空间,还是我还缺少其他东西？
通过简单检查尝试确定DOM元素
isElement = SomeThing instanceof Element
适用于主文档,但不适用于iframe中的(所有？)节点.
示例输出(谷歌浏览器):(主要文档中的mdiv是DIV,iframe中的id是DIV)
OMGWTF
ok: mdiv instanceof Element ... true ... [object HTMLDivElement]
ok: mdiv instanceof Object ... true ... [object HTMLDivElement]
ko: idiv instanceof Element ... false ... [object HTMLDivElement]
KO : idiv instanceof Object ... false ... [object HTMLDivElement]
主文档和iframe文档有不同的javascript实现???
请解释我的错误.
示例:(http://www.sbmintegral.sk/GITHUB/OMGWTF/obalka.xhtml)
代码:obalka.xhtml(主要文件)
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Obalka</title>
</head>
<body>
<div id="auto_filled_commands_container">
MAIN div id="auto_filled_commands_container"<br/>
<iframe id="auto_filled_commands_iframe" src='dopis.xhtml' style="width:98%;height:98%;"/>
</div>
<div>
<textarea id="OMGWTF" style="width:700px;height:200px">
mdiv = …谁能告诉我如何将其他XML命名空间添加到HTML 5文档中？
我正在尝试创建以下的HTML 5版本
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://ogp.me/ns#"
xmlns:fb="https://www.facebook.com/2008/fbml">
是否只是删除xhtml命名空间的情况:
<html xmlns:og="http://ogp.me/ns#"
xmlns:fb="https://www.facebook.com/2008/fbml">
谢谢.