HTML内のクラス名の内容を取り出したい

質問

こんにちは。

<div id ="content">
　<p class="txt">
　　内容
　</p>
</div>

と言う内容のHTMLから、クラス名txtの文章を取り出したいのです。className、getElementsByClassNameなどを見てみましたが、よく意味が分かりません。

そこでなのですが、クラス名txtの文章を取り出す良い手段か、className、getElementsByClassNameについて教えていただけませんか？

よろしくお願いします。

回答No.1

yambejp · ベストアンサー

getElementByClassNameは実装があやしいので、こんな風にしてみては？

<script>
window.onload=function(){
var tags=getElementsByClassNameA("txt");
if(tags)
for(var i=0;i<tags.length;i++){
alert(tags[i].innerHTML);
}
}

function getElementsByClassNameA(n){
var tags=document.getElementsByTagName("*");
var obj=null;
for(var i=0;i<tags.length;i++){
if(tags[i].className==n){
if(!obj){
obj=new Object();
obj.length=0;
}
obj[obj.length]=tags[i];
obj.length++;
}
}
return obj;
}

</script>

<div id ="content">
<p class="txt">
内容1
</p>
<p class="txt">
内容2
</p>
<p class="txt">
内容3
</p>
</div>

ただしこれは「文章」をとりだしているわけではないので
テキストノードを取り出すにはもうすこし工夫が必要

お礼

丁寧な回答ありがとうございます。

早速回答のjavascriptを写した所、内容の表示に成功しました。
ただのコピーアンドペーストではいけないので、内容を理解出来るようにしたいと思います。