根据空状态显示和隐藏标签

Question

每次我在不同的输入上键入时，我都会将几个按钮附加到一个 html span 标签中。

<span id="pill_filters>
  <button id="filterCreated">Filter name here</button>
  <button id="filterCreated2">Filter name here</button>
</span>

我还想在此跨度标记内有按钮时显示一个标签，如果没有，我想隐藏该标签。

<label id="label_sc">Search Criteria:</label>

到目前为止，我的 jquery 是

function showSCLabel(){
  if ($("#pill_filters").html.is(':empty')){
     $("#label_sc").addClass("d-none");
  }else{
   $("#label_sc").removeClass("d-none");
  }
}

但它似乎不起作用。该标签从一开始就已经具有“d-none”类，即使如此，它仍在显示。我究竟做错了什么？这不是 :empty 状态的工作方式吗？我可以用什么代替？非常感谢您的帮助！

Answer 1

• if 语句丢失 ()
• .html.is jQuery 无效

用途：

if ( $("#pill_filters").is(':empty') ) {    

Answer 2

不用jQuery回答：

//span
const span=document.getElementById("pill_filters");
//label
const label=document.getElementById("label-sc");

span.addEventListener('DOMSubtreeModified',function(){
  //if innerHTML is not ""
  if(span.innerHTML){
    //show label
    label.style.display="block";
  }else{
    //hide label
    label.style.display="none";
  };
};