Question

我有以下结构：

<div class="main">
   <div class="submain">
      .....
      <div class="sub..submain">
      </div>
      .....
   </div>
   <div class="submain">
   </div>
</div>

有些子元素有css属性float:right;，我不知道有多少级别。如何使用选择器$('.main')选择具有此css属性的所有元素？我有一个想法，但我想找到一个更简单的方法来做到这一点：

var elemsArray=[];
   function findNeededChildren(elem){
      var hasChildren = elem.children().length>0?true:false;
      if(hasChildren ){
            $.each(elem.children(),function(){
            if($(this).css('float')=='right')elemsArray.push($(this));
            findNeededChildren($(this));
      });
   }
}
findNeededChildren($('.main'));

Answer 1

您可以按属性选择元素，因此您可以尝试

$('div[style="float:right"]')

这应该选择具有该属性的所有div。但我不确定它是否也会选择超过这种风格的东西。

编辑：

我只记得我工作的一些人使用类来做这类事情。它使可维护性更容易。制定一条css规则：

.floatRight { float:right }

然后将此类分配给需要浮动的所有内容。这些应该更容易选择。

Answer 2

您可以执行类似

的操作

$(document).ready(function(){
   $(".main").find("div").each(function(){
     if($(this).css("float") == "right") {
      // This is the required div
     }
   });
})

如果您不知道 .main 的孩子是div或其他标签，那么请使用

$(document).ready(function(){
   $(".main").children().each(function(){
     if($(this).css("float") == "right") {
      // This is the required element with float: right property
     }
   });
})

使用jquery选择具有特殊css属性的元素

2 个答案: