JQuery中if语句位置疑问：替换阅读时间插件输出文本

实现方案 #

直接利用readingTime插件的success回调函数，在阅读时间计算完成后检查文本内容并替换；也可搭配延迟检查作为备选方案，确保替换生效：

代码示例 #

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/reading-time/2.0.0/readingTime.min.js"></script>
<script>
  (function($) {
    $(document).ready(function() {
      $('.et_pb_post_content').readingTime({
        readingTimeTarget: $('.eta'),
        wordCountTarget: $('.word-count'),
        wordsPerMinute: 275,
        lang: 'en',
        // 计算完成后触发回调，精准判断并替换文本
        success: function(data) {
          if (data.readingTimeText === 'Less than a minute') {
            $('.eta').text('<1 min');
          }
        }
      });

      // 备选方案：若回调不生效，延迟检查目标元素文本
      setTimeout(function() {
        const $etaElement = $('.eta');
        if ($etaElement.text().trim() === 'Less than a minute') {
          $etaElement.text('<1 min');
        }
      }, 100);
    });
  })(jQuery);
</script>

<div class="et_pb_post_content">Here is some content</div>

Word count: <span class="word-count"></span>. Reading time: <span class="eta"></span>

说明 #

• success回调是插件官方提供的钩子，计算完成后自动触发，通过参数data可直接获取插件生成的文本内容，判断替换的准确性最高。
• 延迟检查方案用于兼容特殊场景下回调不触发的情况，短延迟能确保插件已完成文本渲染。

内容的提问来源于stack exchange，提问作者Matei