cutmail's blog

write the code

エスケープさせないでDOM要素のテキストからオブジェクトを取得する方法

すげー長いタイトル。
前回、DOMのテキストからinnerHTMLを使って内容を取得すると、なぜかエスケープされてしまうというのを紹介しましたが、
今回はこんな場合の回避策を。

しかし、ブラウザによって使える使えないというメソッドのため、ブラウザ判別が必要です。

IEの場合

<script type="text">
function get_text(){
  var txt = document.getElementByID("hoge").innerText;
}
</script>
<form name="frm1">
<div id="hoge">You&I</div>
<input type="button" onclick="get_text();" />
</form>

Firefoxの場合

<script type="text">
function get_text(){
  var txt = frm1.hoge.textContent;
}
</script>
<form name="frm1">
<div id="hoge">You&I</div>
<input type="button" onclick="get_text();" />
</form>

どちらも、要素の中身をHTMLとして取りだすのではなく、テキストとして取りだすので
結果としてエスケープされていない生のテキストがtxtという変数に入ることになります。