dojo - 如果尚未将节点添加到 dom，如何通过 Id 获取节点？答案

【问题标题】：dojo - How to get node by Id if it has not been added to the dom yet?dojo - 如果尚未将节点添加到 dom，如何通过 Id 获取节点？
【发布时间】：2013-06-03 16:00:59
【问题描述】：

我正在开发一个包含Dialog 的自定义dojo 小部件。 Dialog 内容作为文本从模板 html 文件加载。我遇到的问题是，在将 Dialog 添加到 dom 之前，我需要将 dom 节点添加到 Dialog 内容。

这是我的模板 (DialogContent.html)：

<div>
    <table>
        <tbody>
            <tr>
                <td>
                    <label for="printTitle">Map Title:</label>
                </td>
                <td>
                    <input id="printTitle" data-dojo-type="dijit/form/TextBox" name="title" />
                </td>
            </tr>
            <tr>
                <td>
                    <label for="printOrientation">Page Orientation:</label>
                </td>
                <td>
                    <select id="printOrientation" data-dojo-type="dijit/form/FilteringSelect" name="orientation">
                        <option value="Letter ANSI A Landscape">Landscape</option>
                        <option value="Letter ANSI A Portrait">Portrait</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    <label for="printUnits">Scale Bar Units:</label>
                </td>
                <td>
                    <select id="printUnits" data-dojo-type="dijit/form/FilteringSelect" name="units">
                        <option value="Miles">Miles</option>
                        <option value="Kilometers">Kilometers</option>
                        <option value="Feet">Feet</option>
                        <option value="Meters">Meters</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    <label for="printLayers">Layers to Include in Legend:</label>
                </td>
                <td>
                     <select id="printLayers" data-dojo-type="dijit/form/MultiSelect" name="layers"></select>
                </td>
            </tr>
        </tbody>
    </table>
    <div>
        <button data-dojo-type="dijit/form/Button" type="submit">OK</button>
    </div>
</div>

然后我使用define([...,...,...,"dojo/text!./PrintWidget/templates/DialogContent.html"]...)将模板作为文本加载到我的小部件中

这是作为字符串变量出现的，但我需要在#printLayers 下动态添加选项。因为它只是一个文本字符串，所以我不能将它用作 dom 节点。当我使用domConstruct.toDom(dialogContent) 时，它会转换为我可以使用的实际 dom 节点，但由于此时 dom 节点实际上尚未添加到 DOM（它只是一个 javascript dom 对象），我无法访问#printLayers 通过dom.byId 或dojo/query。

如何在我的模板中访问#printLayers 以动态添加option 元素？

【问题讨论】：

Layers to Include in Legend: 然后你可以在你的小部件 this.printLayers
@Marius - 出于某种原因，我认为我不能为此使用data-dojo-attach-point，因为它实际上不是小部件本身的模板，而是小部件Dialog 的模板打开。现在想想，其实也没什么区别。谢谢。

标签： javascript templates dom dojo

【解决方案1】：

结果证明解决方案与操作顺序有关。我无法使用 dom 节点，因为它尚未添加到 dom 中。它只是一个 javascript 对象。一旦我创建了Dialog 并将dom 节点设置为Dialog 的content，dom 节点就被添加到dom 中，我可以使用dom.byId("printLayers") 访问#printLayers。

【讨论】：