Question

我有这个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>

我想现在使用fluid-width-video-wrapper类为每个div添加一个id。新的id值应以“fluid”开头，后跟嵌套在该div中的iframe id值。

所以结果看起来像（当然没有**，只是为了突出显示）：

<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

你应该试试

。每个

$('.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>

应该这样做，你可以使用.next（）获取下一个元素的id，如果你需要它是100％动态的。

请参阅：
每个 - 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（）方法找出包含fluid-width-video-wrapper类的每个div。然后你找到那个div的孩子，那就是你的iframe，并获得iframe的id。然后将'fluid'附加到iframe的id并将其设为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

number of milliseconds since January 1, 1970, 00:00:00 GMT

JQuery如何使用iframes id +“whatever”的值向iframe的父div添加id？

7 个答案: