使用 JavaScript 使 table 消失

Question

这些是 Js 和 Html 代码：

function div(window.matchMedia("(max-width:800px)")) {
    if (window.matchMedia("(min-width:800px)")) {
        document.getElementById("invtable").style.display = "block";
    } else {
        document.getElementById("invtable").style.display = "none";
    }
}

<div class="widget widget-table action-table" id="invtable">
    <div class="widget-header"> <i class="icon-th-list"></i>
        <h3>Últimos Podcasts</h3>
    </div>
    <!-- /widget-header -->
    <div class="widget-content">
        <table class="table table-striped table-bordered">
            <thead>
                <tr style="width:300px">
                    <th> Nº</th>
                    <th> Título da Postagem </th>
                    <th> DATA</th>
                    <th> Link</th>
                    <th> Descrição</th>
                    <th class="td-actions"> </th>
                </tr>
            </thead>
            <tbody>               
            </tbody>
        </table>
    </div>
    <!-- /widget-content --> 
</div>

我需要这个 html table 消失，因为它不响应移动设备。

我试过用window.matchMedia，相当于Media Queries，可惜没有得到预期的结果

Answer 1

您需要检查 .matches

  if (window.matchMedia("(min-width:800px)").matches) {
    document.getElementById("invtable").style.display = "block";
  } else {
    document.getElementById("invtable").style.display = "none";
  }