我认为另一个“流动”要求是将overflow 设置为visible。
From the CSS2 spec:
浮动、绝对定位元素、不是块框的块容器（例如内联块、表格单元格和表格标题），以及具有“溢出”而不是“可见”的块框（该值除外已传播到视口）为其内容建立新的块格式化上下文。
根据您引用的要求和overflow 要求，这是使用 jquery 的一种方法：
function isInFlow(elm, ctxRoot) {
ctxRoot = ctxRoot || document.body;
var $elm = $(elm),
ch = -1,
h;
if (!$elm.length) {
return false;
}
while ($elm[0] !== document.body) {
h = $elm.height();
if (h < ch || !okProps($elm)) {
return false;
}
ch = h;
$elm = $elm.parent();
if (!$elm.length) {
// not attached to the DOM
return false;
}
if ($elm[0] === ctxRoot) {
// encountered the ctxRoot and has been
// inflow the whole time
return true;
}
}
// should only get here if elm
// is not a child of ctxRoot
return false;
}
function okProps($elm) {
if ($elm.css('float') !== 'none'){
return false;
}
if ($elm.css('overflow') !== 'visible'){
return false;
}
switch ($elm.css('position')) {
case 'static':
case 'relative':
break;
default:
return false;
}
switch ($elm.css('display')) {
case 'block':
case 'list-item':
case 'table':
return true;
}
return false;
}
有关测试用例，请参阅此jsFiddle。
我不确定是否使用window.getComputedStyle() 会更好。
该函数正在检查elm 是否在ctxRoot 的流或块格式化上下文中（我认为它之前被称为）。如果未提供ctxRoot，它将检查body 元素。这不会检查以确保 ctxRoot 处于流动状态。所以，有了这个 HTML
<div id="b" style="overflow: hidden;">
<div id="ba">ba
<p id="baa">baa</p>
<span id="bab">bab</span>
<span id="bac" style="display:block;">bac</span>
</div>
</div>
测试用例是：
var b = $('#b')[0];
console.log('no ',isInFlow(b));
console.log('no ',isInFlow('#ba'));
console.log('yes ',isInFlow('#ba', b));
console.log('no ',isInFlow('#baa'));
console.log('yes ',isInFlow('#baa', b));
console.log('no ',isInFlow('#bab'));
console.log('no ',isInFlow('#bab', b));
console.log('no ',isInFlow('#bac'));
console.log('yes ',isInFlow('#bac', b));