JQuery iframeの親divにidを追加するにはiframe id + "whatever"の値を使用しますか？

Question

私は流体幅ビデオ・ラッパークラスでそれぞれのdivに今のidを追加するこのHTMLに

<div id="cont"> 
<div id="videowrapper" class="fitmein"> 
<div id="vimeoposition" style="display: block;"> 
<div class="fluid-width-video-wrapper" style="padding-top: 56.25%;"> 
<iframe id="player1" class="vimeo" src="http://player.vimeo.com/blablabla"> 
</div> 
<div class="fluid-width-video-wrapper" style="padding-top: 56.25%;"> 
<iframe id="player2" class="vimeo" src="http://player.vimeo.com/blablabla"> 
</div> 
</div> 
</div> 

を持っています。 新しいIDの値は、 "fluid"で始まり、そのdivにネストされたiframe idの値が続きます。

だから、結果は（ただ強調するために、** Sなしのコース）のようになります。

<div **id="fluidplayer1"** class="fluid-width-video-wrapper" style="padding-top: 56.25%;"> 
<iframe **id="player1"** class="vimeo" src="http://player.vimeo.com/blablabla"> 
</div> 
<div **id="fluidplayer2"** class="fluid-width-video-wrapper" style="padding-top: 56.25%;"> 
<iframe **id="player2"** class="vimeo" src="http://player.vimeo.com/blablabla"> 
</div> 

を私はそれを行うにはどうすればよいですか？それを行う必要があります

Answer 1

あなたはこのよう

.each

$('.fluid-width-video-wrapper').each(function() { 
    var player = $(this).children().attr("id"); 
    $(this).attr('id', 'fluid'+player); 
}); 

Answer 2

<script type="text/javascript"> 
    $(function() { 

     $(".fluid-width-video-wrapper").each(function(index) { 
      $(this).attr("id","fluidplayer" + index); 
     }); 

    }); 
</script> 

あなたは100％で、動的であることを、それを必要に応じて、あなたは、次の要素のidを取得するために）（.nextを使用することができます。

参照：
各 - http://api.jquery.com/each/
たAttr - http://api.jquery.com/attr/

編集

---

<script type="text/javascript"> 
    $(function() { 

     $(".fluid-width-video-wrapper").each(function(index) { 
      $(this).attr("id","fluid" + $(this).children("iframe").attr("id")); 
     }); 

    }); 
</script> 

は、動的バージョンである必要があります。

Answer 3

$(".classname").each(function(count){$(this).attr("id","new-id"+count)}); 

Answer 4

いくつかのことを試してみてください。 JSFiddler

$('iframe').each(function(){ 
    var divObj = $(this).parent('div').attr('id',$(this).attr('id') + 1) 
     alert($(divObj).attr('id')); 
}); 

Answer 5

あなたは.each（）メソッドを使用することによって、流体幅ビデオ・ラッパークラスでそれぞれのdivを見つけることができます。次に、そのdivの子供たち、つまりあなたのiframeを見つけ、iframeのidを取得します。次に、iframeのIDに 'fluid'を追加し、divのIDにします。
ここにコードがあります。

$('.fluid-width-video-wrapper').each(function() { 
    var divID = $(this).children('iframe').attr("id"); 
    $(this).attr('id', 'fluid' + divID); 
}); 

Answer 6

なぜ子セレクタとparent（）を使用しないのですか？

$('.fluid-width-video-wrapper > iframe').each(function(){ 
    $(this).parent().attr("id", "fluid" + $(this).attr('id')); 
}); 

Answer 7

<script type="text/javascript"> 
    window.onload = function() { 
     var frame = document.getElementById("frame1"); 
     var win = frame.contentWindow; 
     win.showMessage("Hello from Main Page in iFrame"); 
    };  
</script>