在 Dojo 的父元素内创建元素答案

【问题标题】：Create element inside of parent element in Dojo在 Dojo 的父元素内创建元素
【发布时间】：2013-10-09 16:46:12
【问题描述】：

我可以像这样在体内创建一个div：

var n = dojo.create("div", { innerHTML: "<p>helloWorld</p>" }, dojo.body());

我想在我的父元素中创建一个div，例如：

<div id="parent"></div>

我试过了，但它似乎不起作用：

var n = dojo.create("div", { innerHTML: "<p>helloWorld</p>" }, dojo.query('#parent'));

如何在 DOM 中已经存在的父 div 中创建我的 div？

【问题讨论】：

标签： javascript html dom dojo

【解决方案1】：

您发布的解决方案完全有效。几种选择：

不用查找dom节点，传入一个String（节点的id）即可

require(["dojo/dom-construct"], function(domConstruct){
  var n = domConstruct.create("div", { innerHTML: "<p>helloWorld</p>" }, 'parent');
});

或者您可以构建节点并稍后使用 domConstruct#place 放置它：

require(["dojo/dom-construct"], function(domConstruct){
  var n = domConstruct.create("div", { innerHTML: "<p>helloWorld</p>" });
  domConstruct.place(n, 'parent');
});

domConstruct#place 也可以采用可选的position 参数。 API Docs 有更多相关信息

【讨论】：

【解决方案2】：

如果您需要定位一个类而不是元素 id，我发现以下是有效且易于维护的方法：

require([
  'dojo/query',
  'dojo/dom-construct'
  ], function(
    query,
    domConstruct,
  ){
  var parent = query('.someClass')[0];
  var child = domConstruct.create('div', { innerHTML: '<p>helloWorld</p>'});
  domConstruct.place(child, parent, 'position');
});

鉴于总是以 id 而不是类为目标更好，但在您依赖并不总是可行的外部库的情况下。

【讨论】：

【解决方案3】：

我这样做的方式是这样的（我对任何其他解决方案持开放态度）：

// dojo 1.7+ (AMD)
require(["dojo/dom-construct"], function(domConstruct){
  var n = domConstruct.create("div", { innerHTML: "<p>helloWorld</p>" }, dojo.byId('parent'));
});

// dojo < 1.7
var n = dojo.create("div", { innerHTML: "<p>helloWorld</p>" }, dojo.byId('parent'));

【讨论】：