javascript - getElementById 在有效的 div 上失败？

Question

不解……执行下面10行代码后，elem1已定义，elem2一片空白。然而，这两个代码块是相同的，除了变量名，一个是创建一个“svg”节点(有效)，另一个是创建一个“div”节点(失败):

   var chart_name = "chart_" + ui.panel.id;
   var chart_elem = document.createElementNS(svgNS, "svg");
   chart_elem.setAttributeNS(null, "id", chart_name);
   top.appendChild(chart_elem);
   var elem1 = document.getElementById(chart_name);

   var pldiv_name = "plist_" + ui.panel.id;
   var pldiv_elem = document.createElementNS(svgNS, "div");
   pldiv_elem.setAttributeNS(null, "id", pldiv_name);
   top.appendChild(pldiv_elem);
   var elem2 = document.getElementById(pldiv_name);

如果我在代码的最后一行设置断点，在 getElementById 之前被调用，Firebug 向我展示了这个 HTML View :

<div id="tabs-2" class="etc...">
<svg id="chart_tabs-2">
<div id="plist_tabs-2">
</div>

在 DOM View 中，Firebug 显示 elem1带有本地名称 svg , 和 id chart_tabs-2 .它的下一个兄弟是一个 div，id 为 plist_tabs-2 ，即 pldiv_name 的值.尽管如此， getElementById(pldiv_name)失败。

任何想法为什么？谢谢。

Answer 1

您可以尝试创建不在 SVG 命名空间中的 DIV 吗？

var pldiv_elem = document.createElement("div");