Question

我有以下静态div：

<body>
  <div id="div1"></div>
....

我想通过使用dojo在div1中动态添加id为“div1_1”的div。我该怎么办？

Answer 1

你可以只使用Dojo Base来做 - 如果你使用trunk或Dojo 1.3，则不需要包含任何内容：

dojo.create("div", {id: "div1_1"}, "div1");

此行创建一个id为“div1_1”的div，并将其附加到id为“div1”的元素。显然，您可以一次性添加更多属性和样式 - 在the documentation for dojo.create()中阅读所有相关内容。

Answer 2

使用灵活dojo.place的另一个选项：

dojo.place("<div id='div1_1'></div>", "div1", /*optional*/ "only");

Answer 3

// dojo 1.7+ (AMD)
var n = domConstruct.create("div");

// dojo < 1.7
var n = dojo.create("div");

Answer 4

dojo/dom-construct也可用于创建新节点。

示例用法如下;

require([ "dojo/dom-construct", "dojo/_base/window" ], function(
        domConstruct, win) {
    // creates a new div and append it as the last child of the body
    domConstruct.create("div", null, win.body()));
});

dojo / dom-construct参数是

tag（div，h，img，li等）
属性（新节点属性）
参考节点（放置新节点的位置）
位置（默认为最后）

您可以查看文档以获取更多信息。

Answer 5

dojo.html.set(dojo.byId("div1"), "<div id='div1_1'></div>");

Answer 6

var divNode = document.createElement("div");
divNode.id = "div1_1";
document.body.appendChild( divNode );

这是一个很好的方法，它有助于通过IE7中的某些节点引用问题，您可以继续使用divNode的引用。

如何使用Dojo动态添加div？

6 个答案: