如何用jQuery批量替换同ID/Class的链接与音频源地址？

第一步：修正HTML结构 #

HTML规范中ID必须唯一，重复使用同一ID会导致选择器仅匹配第一个元素，因此先将所有id="urlchange"替换为class="urlchange"：

<button id="change" class="ltr">change link's</button>

<a href="https://dl.faz2music.ir/download/3712434/Ahmad Solo - Shazdeh Pesar [320].mp3" class="urlchange">Download</a>
<a href="https://dl.faz2music.ir/download/3712434/Ahmad Solo - Shazdeh Pesar [128].mp3" class="urlchange">Download</a>

<audio><source type="audio/mp3" src="https://dl.faz2music.ir/download/3712434/Ahmad Solo - Shazdeh Pesar [320].mp3" class="urlchange"></audio>
<audio><source type="audio/mp3" src="https://dl.faz2music.ir/download/3712434/Ahmad Solo - Shazdeh Pesar [128].mp3" class="urlchange"></audio>

第二步：修改jQuery代码实现批量替换 #

使用jQuery的.each()方法遍历所有目标元素，分别处理<a>标签的href和<source>标签的src属性：

$(document).ready(function(){
    $('#change').on('click', function(e) {
        // 批量处理所有带urlchange类的a标签
        $('a.urlchange').each(function() {
            const currentHref = $(this).attr('href');
            const newHref = currentHref.replace('dl.faz2music.ir', 'up.faz2music.ir');
            $(this).attr('href', newHref);
        });

        // 批量处理所有audio下带urlchange类的source标签
        $('audio source.urlchange').each(function() {
            const currentSrc = $(this).attr('src');
            const newSrc = currentSrc.replace('dl.faz2music.ir', 'up.faz2music.ir');
            $(this).attr('src', newSrc);
            // 修改src后触发音频元素重新加载资源
            $(this).closest('audio').load();
        });

        notice.showToast({text: 'Links converted',type: 'success',showClose: true});
    });
});

关键说明 #

• 用类选择器.urlchange替代ID选择器，确保能匹配所有目标元素
• .each()方法逐个遍历元素，保证每个元素的属性都被正确替换
• 对于<source>标签，修改src后调用.load()方法，让音频元素更新加载新资源

内容的提问来源于stack exchange，提问作者Faz2Music.ir