読者です 読者をやめる 読者になる 読者になる

DOMのinnerHTMLに流し込む

Tipsです。JSmartyで処理した結果をDOMのinnerHTMLに流し込む方法のご紹介。現在、JSmarty0.4系開発中。

JSmarty#fetchの利用

tpl = new JSmarty();
tpl.assign("foo","Hello World!!");
document.getElementById('hoge').innerHTML = tpl.fetch("string:{$foo}");

PHPやっていてdisplayばかり使っているのでfetch利用わすれちゃいますが…JSmary#fetchやSmarty#fetchともにテンプレート処理してその結果を返すという仕様です。JSmartyではdisplayよりfetchのほうを多様するかと思います。

JSmarty.System.print()のハック

JSmarty.System.print = function(str){
    document.getElementById('hoge').innerHTML = str;
};
tpl = new JSmarty();
tpl.assign("foo","Hello World!!");
tpl.display("string:{$foo}");

JSmarty#displayを使ってinnerHTMLに代入したい場合はJSmarty.System.printをハックするのが便利です。JSmarty.System.printのデフォルトがdocument.writeなのでDOMノード形成後は利用しづらくなってしまいます。