如何用JavaScript批量移除页面图片URL的指定域名前缀？

以下代码可以批量移除所有图片src（及srcset）中的指定前缀，将绝对路径转换为相对路径：

document.addEventListener('DOMContentLoaded', () => {
  // 要移除的目标前缀（包含完整路径到主题目录）
  const oldPrefix = 'https://wordpress.creativegigs.net/docly/wp-content/themes/docly';
  // 获取页面所有图片元素
  const allImages = document.querySelectorAll('img');

  allImages.forEach(img => {
    // 处理主图片路径
    if (img.src.startsWith(oldPrefix)) {
      img.src = img.src.replace(oldPrefix, '');
    }
    // 处理响应式图片的srcset（如果存在）
    if (img.srcset) {
      img.srcset = img.srcset.replace(new RegExp(oldPrefix, 'g'), '');
    }
  });
});

代码说明 #

• 等待页面DOM完全加载后执行，确保能捕获到所有图片元素
• 精准匹配你提供的旧路径前缀，替换后直接得到/assets/xxx格式的相对路径
• 额外处理srcset属性，避免响应式图片依然报错

使用方式 #

1. 打开WordPress后台，进入主题编辑器，找到footer.php文件
2. 将这段代码粘贴到</body>标签的上方
3. 保存修改即可生效

或者如果你的主题支持自定义JS功能（比如在「外观-自定义-额外CSS/JS」里），直接把代码粘贴到自定义JS区域也可以。

额外提示 #

• 如果页面中存在http协议的旧路径，可以把oldPrefix改成//wordpress.creativegigs.net/docly/wp-content/themes/docly，这样同时兼容http和https
• 这是前端临时修复方案，长期来看建议直接在WordPress数据库中批量替换旧路径（用phpMyAdmin执行替换SQL），不过考虑到你试过多种方法无效，这个前端方案可以快速解决问题

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