犬ターネット

innerHTML いやだなあ

2011-08-22 javascript

ちょっとした変換ツールが必要だったので、HTML+javascriptでテンプレ作ったんだけど、

<div id="template" style="display:none;">
<a href="{#URL#}">{#NAME#}</a><br />
</div>

これ、div#template の中身を innerHTML で読み込むとこうなる。

alert( document.getElementById('template').innerHTML );
↓
<a href="%7B#URL#%7D">{#NAME#}</a><br>

hrefが勝手にURLエンコードされるし、<br /> が <br> になる。

ちなみに、textarea ＆実態参照で書いて、

<textarea id="template" style="display:none;">
&lt;a href=&quot;{#URL#}&quot;&gt;{#NAME#}&lt;/a&gt;&lt;br /&gt;
</textarea>

valueで取り出すとうまくいく。

alert( document.getElementById('template').value );
↓
<a href="{#URL#}">{#NAME#}</a><br />

挙動をちゃんと把握しておかないとハマる...