例えば
<div id="hoge">ほげ</div>
とあり、id="hoge"のdivタグで囲まれている部分の内容を取得する場合は、innerHTMLを使用します。
<script>
function get_data(){
//データ取得
data = document.getElementById("hoge").innerHTML;
//データ出力
document.write("実行結果:"+data);
}
</script><p><a href="javascript:void(0)" onclick="get_data()">関数実行</a></p>
<div id="hoge">ほげ</div>
このようにスクリプトを記述し、「関数実行」を押せば「実行結果:ほげ」が表示されます。(このソースだと地味なんでわかりにくいですが^^;)
なおinnerHTMLはデータを取得するだけでなく、指定したidを持つタグに出力することもできます。
<script>
function get_data(){
//データ取得
data = document.getElementById("hoge").innerHTML;
//データ出力
document.getElementById("output").innerHTML = data;
}
</script><p><a href="javascript:void(0)" onclick="get_data()">関数実行</a></p>
<div id="hoge">ほげ</div>
<div id="output"></div>
というようなソースにすれば、id="hoge"のデータを取得後、id="output"に取得したデータを表示させることができます。
ちなみにこのinnerHTMLによる出力、id="output"のタグにあらかじめ内容が記述されていたとしても、javascriptの実行結果が優先され、中身がすり替わって表示されます。(サンプル参照)
■サンプル [新しいウィンドウで開く]