Question

我对UI知之甚少。我有一个问题，我的jsp通过逻辑生成标记如下：

Slider
<div id="gridslider" class="jcarousel home ">
   Slide_0
   <div class="slide">
      <div class ="f50">
         Grid Feature
         <div class="feature  " style="background-image: ">
            <div class="content ">
            </div>
         </div>
      </div>
      <div class ="f12">
         Grid Feature
         <div class="feature  " style="background-image: ">
            <div class="content ">
            </div>
         </div>
      </div>
   </div>
   Slide_1
   <div class="slide">
      <div class ="f100">
         Grid Feature
         <div class="feature  " style="background-image: ">
            <div class="content ">
            </div>
         </div>
      </div>
   </div>
</div>

您可以看到我在<div class ="f50">下面有一些类<div class ="side">，而在<div class="feature " style="background-image: ">下面有<div class ="side">。我想要<div class ="f50">级别的所有逻辑像<div class="feature " style="background-image: ">这样的div会移动它的值，即＆＃34; f50＆＃34;功能类<div class="feature f50" style="background-image: ">将<div class ="f50">，{{1}}将被删除，其他内容相同。

任何想法我怎样才能实现这一点。

由于

Answer 1

使用：

$('.feature  ').each(function(){
 $(this).addClass($(this).parent().attr('class'));
 $(this).unwrap();
});

Working Demo

Answer 2

也许你应该重构那个jsp，但这里有一些代码可以满足你在jQuery中的需求：）

$(function(){

  $('.feature').each(function(){
    //read class from parent
    var classes = $(this).parent().attr('class');

    //add parents class and remove parent  
    $(this).addClass(classes).unwrap();
  });

});

这是一个链接，您可以尝试一下 http://jsbin.com/pohiqedene/1/edit?html,js,output

在子div中设置父div类

2 个答案:

Working Demo