使用Jquery在頁面加載中隱藏div

Question

我的代碼中有一些div，如下所述。 通過jQuery，我想隱藏具有class =“ redCategory redCap vertical”的div。 我要隱藏div的Jquery代碼是$(".redCap").hide(); 但是頁面加載后div不會被隱藏。 什么是Jquery？ 我想在頁面加載期間隱藏div。

<div class="redLinkContainer">

    <span class="accessibleText" aria-level="1" role="heading"></span>
    <div class="redCategory redHome adjacent"><a> href="https://example.com/">1</a></div>
    <div class="redCategory redContact adjacent"><a> href="https://example.com/">2</a>></div>
    <div class="redCategory Things adjacent"><a> href="https://example.com/">3</a></div>
    <div class="redCategory redCap vertical">
        <a class="red CategoryTitle redCategoryHeader" href="https://example.com/">4</a>
          </div>
     <div class="redCategory ManyThings adjacent"><a> href="https://example.com/">5</a></div>
    </div>

Answer 1

隱藏在div中：

 <div class="redCategory redCap vertical" hidden> <a class="red CategoryTitle redCategoryHeader" href="https://example.com/">4</a> </div> 

Answer 2

將此添加到css文件

.divHide{display:none;}
.divShow{display:block;}

您的HTML代碼：

<div class="redLinkContainer divHide"></div>

當頁面加載div隱藏時。

Answer 3

<a>標簽格式錯誤。 請使用正確的格式

<a class="red CategoryTitle redCategoryHeader" href="https://example.com/">4</a>

請找到下面的URL，（檢查您的代碼）

https://jsfiddle.net/wg62c8j5/

Answer 4

我在這里做了一些測試，它按預期工作。

<script type="text/javascript">

 $(".redCap").hide();

</script>

<div class="redLinkContainer">

    <span class="accessibleText" aria-level="1" role="heading"></span>
    <div class="redCategory redHome adjacent"><a>   href="https://example.com/">1</a></div>
    <div class="redCategory redContact adjacent"><a> href="https://example.com/">2</a></div>
    <div class="redCategory Things adjacent"><a> href="https://example.com/">3</a></div>
    <div class="redCategory redCap vertical">
       <a class="red CategoryTitle redCategoryHeader" href="https://example.com/">4</a>
      </div>
  <div class="redCategory ManyThings adjacent"><a> href="https://example.com/">5</a></div>

您確定要加載JQuery庫嗎？