查找包含特定CSS属性的父级

时间:2015-11-11 13:39:54

标签: javascript jquery html css

我需要找到包含以下css属性的最近父级:

background-image: url(*here goes a link to a valid image*);

找到它可能是通过选择所有元素,在数组中过滤它们,然后使用数组的第一个/最后一个元素来完成的,但我想知道是否有更快的方法来选择最接近的父元素我之前提到的要求,如下:

<parent1 style="background-image:url(http://google.com/images/photo.png);">
        <parent2 style="background-image:url('http://google.com/images/photo.png');">
                <mydiv></mydiv>
        </parent2>
</parent1>

我想选择parent2;

请注意,我不知道后台网址

3 个答案:

答案 0 :(得分:4)

您可以扩展jQuery选择器以允许此操作。并根据您的具体规则。

这样的事情:

&#13;
&#13;
$.extend($.expr[':'], {
  backgroundValid: function(a) {
    //change the url for what you want
    return $(a).css('background-image') === "url(http://stacksnippets.net/validurl)";
  }
});

var test = $('.foo').closest('div:backgroundValid');

console.log(test) //prints bar
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="background-image:url('validurl');">
  <div class="bar" style="background-image:url('validurl');">
    <div class="foo"></div>
  </div>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

无需过滤所有父母,只需按照此jsfiddle

进行递归

<强> HTML

<div id="parent1" style="background-image:url(validurl);">
    <div id="parent2" style="background-image:url(validurl);">
        <div id="start"></div>
    </div>
</div>

<强>的javascript

$(function() {
    var cssKey = "background-image";
    var element = $('#start');
    var found = false;
    while (!found) {
        element = element.parent();
        found = element.css(cssKey) == 'none' ? false : true;
        if (element.is($('html'))) break;
    }
    if (found) {
        console.log(element.attr('id'));
    } else {
        console.log('Not found');
    }
});

答案 2 :(得分:0)

可能这可以帮到你,

  1. 选择元素
  2. 拿起所有父母
  3. 根据您的需要过滤其父级!
  4. library(dplyr)
    library(ez)
    
    dt = read.table(text=" time   id  var1    var2    var3    var4    var5    var6
                    a   1   36.9    82.7    22.2    24.2    37.9    46.5
                    a   2   35.0    88.9    27.4    27.3    37.4    44.9
                    a   3   39.6    85.6    23.1    24.0    35.4    46.0
                    a   4   37.1    87.6    25.2    25.5    39.7    47.1
                    a   5   36.9    87.1    25.8    25.1    36.7    44.4
                    a   6   37.7    89.7    25.8    26.6    41.9    41.2
                    a   7   36.2    87.3    25.6    26.0    34.5    42.0
                    a   8   37.1    88.3    25.5    26.0    39.7    41.6
                    a   9   34.9    87.8    26.2    26.9    35.7    45.1
                    a   10  39.7    87.4    24.7    23.3    40.0    41.3
                    b   1   37.3    91.7    27.9    27.1    39.0    46.4
                    b   2   41.0    87.3    23.4    23.5    39.0    49.1
                    b   3   36.9    91.0    27.7    27.1    43.0    44.6
                    b   4   34.1    91.3    28.6    28.9    38.6    42.7
                    b   5   35.7    87.3    25.9    26.3    41.4    44.8
                    b   6   39.7    89.5    25.3    25.0    39.1    45.5
                    b   7   42.4    89.8    25.6    22.2    43.2    50.3
                    b   8   37.3    89.9    26.1    26.8    38.3    42.9
                    b   9   37.5    93.5    29.0    27.7    40.1    50.8
                    b   10  39.4    91.7    26.0    26.5    42.0    51.6
                    c   1   38.5    89.3    24.6    26.3    41.7    48.9
                    c   2   38.4    85.8    24.0    24.3    35.4    40.8
                    c   3   40.2    94.3    27.0    27.9    40.7    44.1
                    c   4   35.9    88.4    26.7    26.5    37.8    44.5
                    c   5   37.7    88.0    25.9    24.6    36.4    44.1
                    c   6   34.1    84.7    25.4    25.3    37.4    43.4
                    c   7   36.1    84.8    24.5    24.8    39.6    44.7
                    c   8   38.6    90.1    26.4    25.6    38.7    47.8
                    c   9   34.5    84.7    25.1    25.2    37.7    42.1
                    c   10  35.2    84.6    24.9    24.9    33.7    38.9", header=T)
    
    # create a vector of names of variables of interest
    variables_of_interest = dt %>% select(matches("var")) %>% names()
    
    
    dt_res =
    data.frame(variables_of_interest,                         ## create a data frame with variable names as a column
               stringsAsFactors = F) %>%
      group_by(variables_of_interest) %>%                     ## for each variable of interest
      do({dt2 = dt[,c(.$variables_of_interest,"id","time")]   ## pick that variable along with id and time
          names(dt2)[1] = "var"                               ## rename that variable to "var" (to be used as a name within ezANOVA)
          res = ezANOVA(data = dt2,                           ## run ezANOVA
                        dv = .(var), 
                        wid = .(id), 
                        within = .(time), 
                        detailed = T, type = 3)
          data.frame(res)})                                   ## save results as a dataframe to be returned next to the variable name