HTMLの動的生成

DomHelper

Ext.DomHelperクラス（以降DHと略）はHTMLを動的に生成するためのユーティリティクラスで、DOMを直接操作することによる生じる様々なクロスブラウザー問題を回避してくれます。DHでは必要に応じてHTMLフラグメントやinnerHTMLを利用することにより、互換性を犠牲にすることなく最適化された処理速度を提供しています。DHはシングルトンクラスであるため、インスタンスを生成することなくその全てのメソッドを利用することが可能です。

DHで利用できるメソッドは以下の通り：

markup（非推奨となったcreateHtmlと同じ機能）

insertHtml

insertBefore

insertAfter

insertFirst

append

overwrite

var myEl = document.createElement('a');
myEl.href = 'http://www.yahoo.com/';
myEl.innerHTML = 'My Link';
myEl.setAttribute('target', '_blank');

var myDiv = document.createElement('div');
myDiv.id = 'my-div';

myDiv.appendChild(myEl);
document.body.appendChild(myDiv);	

Ext.DomHelper.append(document.body, {
    id: 'my-div',
    cn: [{
    	tag: 'a', 
    	href: 'http://www.yahoo.com/', 
    	html: 'My Link', 
    	target: '_blank'
    }]
});

DomHelperコンフィグオプション

Ext.DomHelperでHTMLを動的に生成する場合、ページに挿入するHTMLを表すためのコンフィグオプションを用意します。Ext.DomHelperのコンフィグオプションは任意のHTMLについて表現することが可能です。

<a href="http://www.extjs.com">Ext JS</a>

{
    tag: 'a',
    href: 'http://www.extjs.com',
    html: 'Ext JS'
}

Template

（英語版において未記載）

Templateクラスのメソッド

（英語版において未記載）