javascript - 如何在javascript中的外部函数内隐藏按钮

Question

如何根据条件控制按钮隐藏例如，我们有

<div class="button">
<button style="font-weight:bold" 
onclick="displayValue();"> Submit </button>
</div>  

我们有带有函数displayValue()的javascript文件

function displayValue(arr){
    if(condition){
        //wanna hide the button if this condition is satisfied 
    }else{
        alert("in this condition, the button will still be showed")
    }
}

Answer 1

您可以简单地将display设置为none:

function displayValue() {
  if (true) {
    document.querySelector("button").style.display = "none";
  }
}

<div class="button">
  <button style="font-weight:bold" onclick="displayValue();"> Submit </button>
</div>

如果您在多个元素上使用该函数，您也可以将元素传递给该函数:

function displayValue(element) {
  if (true) {
    element.style.display = "none";
  }
}

<div class="button">
  <button style="font-weight:bold" onclick="displayValue(this);"> Submit </button>
</div>