0

以下に示す html には、同じクラス名と構造を持つこのメイン div があります。私cxfeeditem feeditemのthere are many divs質問は、クラス名で始まるすべてのdiv cxfeeditem feeditem、子の値を取得する方法です。

1. クラス名 cxfeeditem feeditem

2.class=feeditemtimestamp

3.cxcommentsフィードアイテムコメント

4.cxfeeditem フィードアイテム

 <div class="cxfeeditem feeditem">
   <span class="feeditemtext cxfeeditemtext">
      This is my blog
   </span>
   <a class="feeditemtimestamp">Yesterday 2:13PM</a>
   <div class="cxcomments feeditemcomments"> 
     These are my comments
   </div>
   <div class="cxfeeditem1 feeditem1">
     My comments for the comment
   </div>  

</div>

EDIT : 次のような値を警告したい出力:

    This is my blog
    Yesterday 2:13PM
    These are my comments
    My comments for the comment

次のことを試しましたが、null が返されます。

$("div.cxfeeditem.feeditem").each(function() {
   alert($(this).children('span.feeditemtext.cxfeeditemtext').html());
   alert($(this).children('a.feeditemtimestamp').html());
   alert($(this).children('div.cxcomments.feeditemcomments').html());
   alert($(this).children('div.cxfeeditem.feeditem').html());
   break;
 });
4

2 に答える 2

2

私が見ることができる最も簡単な方法は次のとおりです。

​$('.cxfeeditem.feeditem').filter(
    function(){
        return !$(this)
            .parents('.cxfeeditem.feeditem')
            .length​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​;
    }).children().each(
        function(){
            console.log($(this).text().trim());
        });​

JS フィドルのデモ。

は、それらのクラスの最も外側の要素の子である同じおよびクラスfilter()の要素にアクセスしていないことを確認するために使用されます。これは少し面倒に感じますが、目的の出力を考えると、これが最善の方法のように思えました。.cxfeeditem.feeditem

その後、フィルターで除外されていない (直接の) 子要素のそれぞれのtrim()空白をログに記録するだけです。text()

以下のコメントでOPからの質問に応じて編集されました。

子クラス名を追加したいが、すべてのタグを考慮したくない場合はどうすればよいですか。たとえば、 onlya.feeditemtimestampとの値が必要な場合span.feeditemtext.cxfeeditemtext

その場合、次の 2 番目の呼び出しを使用できますfilter()。

$('.cxfeeditem.feeditem').filter(
    function() {
        return !$(this).parents('.cxfeeditem.feeditem').length;
    }).children().filter(
        function() {
            var that = $(this);
            return that.is('span.feeditemtext.cxfeeditemtext, a.feeditemtimestamp');
        }).each(        
            function() {
                console.log($(this).text().trim());
            });​

JS フィドルのデモ。

または、次を使用できますfind()（および省略できますchildren()）：

$('.cxfeeditem.feeditem').filter(
    function() {
        return !$(this).parents('.cxfeeditem.feeditem').length;
    }).find('> span.feeditemtext.cxfeeditemtext, > a.feeditemtimestamp').each( 
        function() {
            console.log($(this).text().trim());
        });​

JS フィドルのデモ。

参考文献:

于 2012-07-05T11:53:39.210 に答える
0

あなたの機能に応じて

alert($(this).children('span.feeditemtext.cxfeeditemtext').html());

これは、クラスがcxfeeditemfeeditemである最初のdiv内のspanのテキスト値を示しています。

2番目のdivの場合、スパンは存在しないため、nullになります。

于 2012-07-05T11:35:26.797 に答える