万年素人からHackerへの道

万年素人がHackerになれるまで殴り書きするぜ。

JavaScriptのinnerHTML..etcが役立たん件

こんなのに対して

<div id="tes">&gt;&lt;<<br></div>

こうすると、HTMLタグの置き換え文字が変換されて意味合いが変わってしまう。

var hoge = document.getElementById('tes').innerHTML;

実験

<input type="button" value="innerHTML!" onclick="innerHTMLGo();">
<input type="button" value="textContent!" onclick="textContentGo();">
<input type="button" value="innerText!" onclick="innerTextGo();">

<div id="tes">&gt;&lt;<<br></div>

<script type="text/javascript">
function innerHTMLGo() {
  var hoge = document.getElementById('tes').innerHTML;
  alert(hoge);
}

function textContentGo() {
  var hoge = document.getElementById('tes').textContent;
  alert(hoge);
}

function innerTextGo() {
  var hoge = document.getElementById('tes').innerText;
  alert(hoge);
}
</script>

結果
・innerHTML

><<

・textContent

><<

・innerText

><<


これなら

var hoge = document.getElementById('text').value;

以下が生で取り出せる。テキストボックスだけどテキストボックスに見せかけない作戦!

<input id="text" type="text" name="name" size="30" maxlength="20" value="&gt;&lt;" style="background-color:transparent" disabled>

今回気がついたが・・・・function名にinnerHTML()とかtextContent()とかinnerTextはJSの名前にするのは無理みたい。