.map内のループjQuery

Question

すべてのスパン要素のIDを取得する必要がありますが、取得する際には画像のIDも取得する必要があります。

$('#showChild').append('Found <b>' + $('#Container > span').length + '</b> child SPAN elements <br />'); 

// SHOW THE CHILD DIV'S. 
$('#Container > span').map(function() { 
    $('#showChild').append(this.id + '<br />'); 
    alert(this.id); 
    var id=this.id; 
    alert(id); 
    //CODE BELOW DOES NOT WORK 
    $('#' + id + '> img').map(function() { 
     $('#showChild').append(this.id + '<br />'); 
    }); 
}); 

あなたは兄弟（）関数

$(window).load(function() { 
     $('#showChild').append('Found <b>' + $('#Container > span').length + '</b> child SPAN elements <br />'); 

// SHOW THE CHILD DIV'S. 
     $('#Container > span').map(function() { 
      $('#showChild').append(this.id + '<br />'); 
      alert(this.id); 
      var id=this.id; 
      alert(id); 
      //CODE BELOW DOES NOT WORK 
      $(this).siblings('img').map(function() { 
       $('#showChild').append(this.id + '<br />'); 
      }); 
     }); 
    }); 

またはあなたはそれが意図したかどうかわからない スパン内の画像を配置する必要がある場合がありますを使用する必要があるHTML

<div id="Container"> 
    <span id="Span1"></span> 
    <img id="img1" /> 
    <img id="img2" /> 
    <span id="Span2"></span> 
    <img id="img3" /> 
    <img id="img4" /> 
</div> 

<!--DISPLAY THE CHILD DIV's--> 
<div id="showChild"></div> 

Answer 1

。

別の方法

$(window).load(function() { 
     $('#showChild').append('Found <b>' + $('#Container > span').length + '</b> child SPAN elements <br />'); 

// SHOW THE CHILD DIV'S. 
     $('#Container > span, #Container > img').map(function() { 
      $('#showChild').append(this.id + '<br />'); 
      alert(this.id); 
      var id=this.id; 
      alert(id); 

     }); 
    }); 

Answer 2

IMGタグはspan要素の内側ではありません。 img要素をスパンの内側に追加して、機能させる必要があります。

<div id="Container"> 
<span id="Span1"> 
    <img id="img1" /><img id="img2" /></span> 
<span id="Span2"><img id="img3" /><img id="img4" /></span> 
</div> 
<!--DISPLAY THE CHILD DIV's--> 
<div id="showChild"></div>