检查jquery隐藏和显示的状态

Question

我有一个简单的功能：

expandContact = () => {
    $('#' + this.props.id).find('.ekipa-li-expand').show();
  }

现在我想编写一个检查元素是否可见的条件（如果显示该元素，我想隐藏该元素，如果它被隐藏则显示它。

我可以告诉.show()函数只是将style="display: block;"添加到DOM元素。但是如何在javascript条件下检查？

Answer 1

您无需编写任何条件，只需使用toggle()：

即可

expandContact = () => {
  $('#' + this.props.id).find('.ekipa-li-expand').toggle();
}

作为参考，无论出于何种原因，如果您确实需要知道元素的可见状态，您可以使用is()方法和:visible选择器：

if ($('#' + this.props.id).find('.ekipa-li-expand').is(':visible')) {
  // do something...
}