Question

考虑以下标记：

<div id="0">
    <h1 id="1">
        <span id="2"><span id="3">lorem ipsum</span></span>
    </h1>
</div>

如何使用jQuery找到块级别（即具有display: block）的span＃3的第一个父级？在这种情况下，这将是h1#1。

Answer 1

$("#3").parents().filter(function() {
    return $(this).css("display") === "block";
}).first()

http://jsfiddle.net/DFURw/

Answer 2

嗯。。。我认为那将是


$('#3').parents().each(function(){

    if ($(this).css('display') == 'block') {
        console.log(this);
        //do your stuff if the element is block
        return false; // bail out
    }

});

Answer 3

此解决方案是最短的，不会搜索任何超出必要的元素：

var $el = $('#3');
while ($el.css('display') !== 'block' && ($el = $el.parent().length)){}

完成后，$ el将是display：block的父元素，如果没有，它将是一个没有项目的jQuery元素。

Answer 4

TextArea overlaps with linechart borders。所以，没有进一步的说明，这是我的解决方案。我相信你会发现它比上述解决方案快得多。

var elementBlockDisplays={"run-in":1,"block":1,"table-row-group":1,"table-column":1,"table-column-group":1,"table-header-group":1,"table-footer-group":1,"table-row":1,"table-cell":1,"table-caption":1,"inline-block:":1};

var getBlockParent = function(theElement){
    var cur=theElement.parentElement;
    while (cur&&!elementBlockDisplays[getComputedStyle(cur).display])
        cur=cur.parentElement;
    return cur;
};

如何用jQuery选择第一个块级父级？

4 个答案: