dojo - 既存のノードを dijit に変換する

Question

既存の dom ノード (たとえば div 要素) を特定のクラスの dijit に変換する最良の方法は何ですか? ノードの dojoType 属性を特定の dijit クラスに設定しようとしましたが、うまくいかないようです。私は道場1.6を使用しています。

ありがとう！

Answer 1

ノードをdijitコンストラクターに渡す簡単な方法もあります。

var nodeToDigitize = dojo.query('#mynode')[0];
new myDijit({prop1: val1, ...}, nodeToDigitize);

Answer 2

実行時またはページのブートストラップの一部として (html を制御して)?

マークアップ パーサーを使用すると、ノード階層がわずかに変わる可能性があります。これは、dojoType を設定するときに開始されます。これを回避するには、プログラムによるウィジェットを作成し、それを上記の DOMNode の子として追加する必要があります。したがって、基本的に3つのオプションがあります

1. dojo 構成 parseOnLoad:true を使用し、source-html で dojoType 属性を設定する
2. 実行時に、dojoType を設定した後、ノードでパーサーを手動で呼び出します
3. 実行時に、プログラム API を介してクラスを作成し、使用します.placeAt(domNode)

たとえば、contentpane レイアウト機能を使用してノードを拡張するとします (レイアウト ウィジェットでない場合、innerHTML がどうなるかはわかりません。各ウィジェットのマークアップ ファクトリに依存します)。

マークアップ パーサー アプローチを使用している場合:

<div id="getme" style="background-color:blue">
  Contents
</div>
<script>
  var n = dojo.byId('getme');               n.dojoType="dijit.layout.ContentPane";
  dojo.require("dijit.layout.ContentPane"); dojo.require("dojo.parser");
  dojo.parser.parse(n);
</script>

またはプログラムによるアプローチ:

<div id="getme" style="background-color:blue"></div>
<script>
  dojo.require("dijit.layout.ContentPane");
  var w = new dijit.layout.ContentPane({ href: 'ajaxContents.html' });
  w.startup();
  w.placeAt('getme');
</script>