css - css空伪类不适用于Safari中的动态更新

Question

这是示例

table:empty {
    display: none;
}

<table style="border: 5px solid green;"></table>
<button></button>

<script>
$("button").click(function () {
    $("table").html("<tbody></tbody>");
});
</script>

使用 :empty 伪类动态更新内容时，Safari 不工作。

适用于 Chrome，但不适用于 Safari。

有任何想法吗？

Answer 1

这里有类似的问题。我设法通过“重置”样式使其工作：尝试添加 .css({display: 'initial'}).css({display: ''})

<script>
$("button").click(function () {
    $("table").html("<tbody></tbody>").css({display:'initial'}).css({display: ''});
});
</script>

希望这对你有用