我建议通过更改JavaScript代码中的显示样式来实现。

const el = document.getElementById('container');
    const btn = document.getElementById('btn');

    btn.addEventListener('click', function handleClick() {
    if (el.style.display === 'none') {
        el.style.display = 'block';

        btn.textContent = 'Hide element';
    } else {
        el.style.display = 'none';

        btn.textContent = 'Show element';
    }
    });

您有一个div，其ID为：我的DIV

<div id="myDIV" class="card-header">
    Hello World
</div>

然后调用此Javascript函数以显示元素：

function showDiv() {
document.getElementById('myDIV').style.display = "block";
}

这个用来隐藏它

function hideDiv() {
document.getElementById('myDIV').style.display = "none";
}

请注意，您可以通过以下方式隐藏div：

<div id="myDIV" class="card-header" style="display:none">
    Hello World
</div>

然后调用函数来显示它。

你的触发器必须在你隐藏的元素之外。因为如果隐藏了你甚至不能点击。js函数classList切换会很好。

function evaluateBoolean() {
  const d = document.querySelector('.w div');
  d.classList.toggle('hide');
}

.w {
  height: 40px;
  background: yellow;
}
.hide {
  display: none;
}

<div class="w" onclick="evaluateBoolean()">
  <div> this will be shown or displayed depending on the javascript boolean </div>
</div>

如果你没有使用angular或react这样的框架，你就不能在html中显式地运行js，这些框架允许属性绑定。
为了实现你的js意图，你可以使用这个方法：
1.在div中添加一个ID：

<div id="myDiv"> Toggled div </div>

1.在js脚本中修改evaluateBoleean（）函数以显示/隐藏元素：

function evaluateBoolean() {

const div = document.querySelector("#myDiv");

if (location.hostname.indexOf("someval" > 0) {

    div.hidden = true;

} else {

    div.hidden = false;
}

有一个非常简单的选择：--〉有一个空白文本首先用以下代码替换html代码：--〉

<div hidden="evaluateBoolean()" id="ThingToBeHidden"> this will be shown or displayed depending on the javascript boolean </div>

并放入js代码：--〉

document.getElementById("ThingToBeHidden").innerHTML = "";

所以你已经给div指定了一个特殊的id，其他元素都没有，所以现在js代码选择了这个id的div，然后把它的上下文设置为空，如果你想让文本再次出现，js代码是：--〉

document.getElementById("ThingToBeHidden").innerHTML = "this will be shown or displayed depending on the javascript boolean";

您可以通过几种方式隐藏元素（使用jQuery）：

const o = $(cssSelectorForElementToStyle);
$(o).hide();
$(o).toggle();
$(o).css('display', 'none');
$(o).addClass('css_class_for_hiding_stuff');

此处使用普通JavaScript：

const o = document.querySelector(cssSelectorForElementToStyle);
o.style.display = 'none';
o.classList.add('css_class_for_hiding_stuff');

但是你的问题并没有指出你什么时候做这个检查，所以让我们假设你在页面加载时检查一次布尔值，并根据这个值隐藏或显示一个给定的元素：

$(document).ready(
    () => {
      if (evaluateBoolean() === true) {        
         // do nothing in this case
      } else {
         $('#elementWithThisId').css('display', 'none');
      }
    }
);

不使用jQuery：

document.addEventListener("DOMContentLoaded", function() {

  if (evaluateBoolean() === true) {        
    // do nothing in this case
  } else {
    document.querySelector('#elementWithThisId').style.display = 'none';
  }
   
});