Question

我的html中有以下span元素

<span style="float: right;color: red; display: inline-block;" id="antcl_error"></span>

但是当我检查其可见性时，它说不可见

$(document.body).find("#antcl_error").is(":visible");

如果Span为空白，则上面的代码返回false

Answer 1

检查css显示模式是否不是无：

＆＃13;

if($('body').find("#antcl_error").css('display') != "none") {
   alert('visible')
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span style="float: right;color: red; display:inline-block;" id="antcl_error"></span>

＆＃13;

Answer 2

由于跨度是浮动的并且没有内容且没有宽度和高度，因此它不占用文档中的空间，因此它被认为是不可见的：

您可以检查CSS的可见性值：

if($("#antcl_error").css('visibility') != "hidden") {
   // visible
}

根据文件：

如果元素占用文档中的空间，则认为元素是可见的。   可见元素的宽度或高度大于零。

具有可见性的元素：隐藏或不透明度：0被视为可见，   因为他们仍然在布局中消耗空间。

Answer 3

如上一个线程所述： WordPress removes empty span tag

您可以使用通用 css 将样式元素设置为空的 span 块，并在 span 内放置
标签。然后在你的 css 样式表中应用 display:none;到跨度内的
标签以删除不需要的空间，同时保留样式元素并使其仍然显示。（这取决于你的主题结构）

空白的跨度元素不可见

3 个答案: