javascript - 在javascript中动态写入对象时如何注册DOM id?

标签 javascript dom

我对这个脚本有疑问。起初我有<div>是硬编码的,并且运行良好。但后来我需要动态更改导航栏,因为我更改了链接(数量)。

问题是当注入(inject) element 时,id 没有注册。 .innerHTML =(html 字符串)。

我该如何解决这个问题?

这是代码:

JavaScript:

 function constructNav() {
   var submenu_layer_innerHTML = "";
   var top_nav_innerHTML = "<UL class=\"nav_category\">";
   for (i=0; i<links.length; i++) {
     submenu_layer_innerHTML = "<div class=\"submenu\" id=\"submenu" + i + "\" onMouseOut=\"timeHideNav('" + i + "','1000')\"> </div>";
     top_nav_innerHTML += "<LI id=\"link" + i + "\"><a href=# onMouseOver=\"expandNav('" + i + "');\">" + links[i] + "</a></LI>";
   }
   top_nav_innerHTML += "</UL>";
   document.getElementById("top_nav").innerHTML = top_nav_innerHTML;
   document.getElementById("submenu_layer").innerHTML = submenu_layer_innerHTML;
 }

html:

<script type="text/javascript" src="scripts.js"> </script>
<script type="text/javascript">
var links =["link 1",
    "link 2",
    "link 3",
    "link 4",
    "link 5",
    "link 6"];
</script>

<body onLoad="constructNav();">

<div id="submenu_layer"> </div>
<div id="top_nav"> </div>

我在 Firefox 中遇到此错误:

  line 35: document.getElementById("submenu"+pageNo) is NULL

最佳答案

您在 for 循环的每次迭代期间都会覆盖 submenu_layer_innerHTML。确保使用 +=

关于javascript - 在javascript中动态写入对象时如何注册DOM id?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10001940/

相关文章:

javascript - 无法使用 Vue JS 的 3rd 方组件作为 CDN

javascript - 多次加载未循环的 gif 动画

javascript - 一次选择一个单选按钮

javascript - 使用 DOM 访问 iframe

javascript - KnockoutJS,批量更新observableArray?

javascript - 智能 javascript jquery 对象

javascript - 如何创建一个 json 对象并附加到 node.js 中的实际响应中

javascript - 如何避免 javascript 从不存在的元素中检索值

javascript - 使用 JS (ES6) 切换 Accordion /标签的问题

javascript - 如何将两个父节点连接到一个子节点以及如何务实地为树中的每个节点制作工具提示?在 D3 js (SVG) 中