替換 jQuery 中特定類的圖像標題屬性

Question

我正在嘗試替換頁面上所有包含類名中的字符串slide圖像的 title 屬性。 圖像類名稱各不相同，后跟一個唯一的數字字符串（例如： slide-1234 、 slider-4321 ）所以重要的是它只包含字符串slide 。 我想用 WordPress 帖子標題替換它。 到目前為止，這是我的代碼（不起作用）

<script>
var title = '{{get_the_title()}}';
$('img[class*=slide]').attr('title', title);
</script>

很簡單，但不幸的是不起作用。 我使用alert進行調試並能夠打印標題，但選擇器是問題所在。

這是 HTML

<h6 class="text-primary mb-5 mt-5">Session Photos</h6>
<div id="metaslider-id-1572" style="width: 100%;" class="ml-slider-3-15-3 metaslider metaslider-flex metaslider-1572 ml-slider">
    <div id="metaslider_container_1572">
        <div id="metaslider_1572">
            <ul aria-live="polite" class="slides">
                <li style="display: block; width: 100%;" class="slide-1573 ms-image"><img src="https://knowledge.page.org/wp-content/uploads/2019/07/DSC04292-850x500.jpg" height="500" width="850" alt="" class="slider-1572 slide-1573" title="DSC04292" /></li>
            </ul>
        </div>

    </div>
</div>

Answer 1

我相信您的腳本在 DOM 完全加載之前正在運行。 您可以把腳本代碼在body標簽的底部或嘗試用包裝代碼$(document).ready(function(){...})

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function(){ var title = 'someTitle'; $('img[class*=slide-]').attr('title', title); }); </script> <h6 class="text-primary mb-5 mt-5">Session Photos</h6> <div id="metaslider-id-1572" style="width: 100%;" class="ml-slider-3-15-3 metaslider metaslider-flex metaslider-1572 ml-slider"> <div id="metaslider_container_1572"> <div id="metaslider_1572"> <ul aria-live="polite" class="slides"> <li style="display: block; width: 100%;" class="slide-1573 ms-image"><img src="https://knowledge.page.org/wp-content/uploads/2019/07/DSC04292-850x500.jpg" height="500" width="850" alt="" class="slider-1572 slide-1573" title="DSC04292" /></li> </ul> </div> </div> </div>