使用 JavaScript 使表格消失

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 表消失，因為它不響應移動設備。

我嘗試使用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";
  }