javascript - 当代码等于给定文本时显示 div

Question

我当时的 javascript 代码是错误的。我想显示 div lds-roller 而 id = searchFor 中的文本等于 _

(function() {

  if ($("#searchFor").text() === "_") {
    $('.lds-roller').show();
  }
})();

<div class="lds-roller"><div></div><div></div><div>
</div><div></div><div></div><div></div><div></div><div></div></div>
 <p>
     <span class=""> 

      <span class="">
             <a href="{% pageurl post %}#disqus_thread" id="searchFor"> _
            </a>
      </span>
   </span>
 </p>

似乎在 10 秒后有一个 HTTP 响应将 _ 更改为 1 例如。当发生这种情况时，我希望 lds-roller 不可见。

.lds-roller {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 64px;

}

Answer 1

 $(document).ready(function() {
   if ($("#searchFor").text() === "_") 
   {
       $('.lds-roller').css('display','block');
   }
});

ready() 方法用于在文档加载后使函数可用。一旦页面 DOM 准备好执行 JavaScript 代码，您在 $(document ).ready() 方法中编写的任何代码都会运行。

完整答案

<style>
    .lds-roller {
        display: none
    }
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="searchFor">dsfds_</div>
<div class="lds-roller">Hi I'm lds-roller!</div>

<script>
    (function() {
          if ($("#searchFor").text() === "_") {
            $('.lds-roller').css('display','block');
          }
        })();
</script>