跳转到主内容
趣航编程网 - 趣学编程,启航技术之路!

如何在 Blogger 博客中批量替换失效的外部资源链接(图片/视频)

本文提供一段轻量级 JavaScript 脚本,可自动将博客页面中所有 img 和 video 标签的 src 属性内旧域名(如 123456.com)批量替换为新域名(如 67890.com),无需手动编辑数千篇文章,适用于 Blogger(Blogspot)平台。 本文提供一段轻量级 javascript 脚本,可自动将博客页面中所有 `img` 和 `video` 标签的 `src` 属性内旧域名(如 `123456.com`)批量替换为新域名(如 `67890.com`),无需手动编辑数千篇文章,适用于 blogger(blogspot)平台。 在 Blogger 中,当外部托管的图片或视频资源域名变更(例如原站从 123456.com 迁移至 67890.com),而你又拥有 2000+ 篇历史文章时,逐篇编辑显然不现实。此时,可通过前端 JavaScript 在页面加载时动态修正资源链接——这是一种安全、非侵入、无需修改 Blogger 后台内容的即时修复方案。 以下是一段经过优化的兼容性脚本,支持全局匹配(避免仅替换首次出现)、保留路径结构,并兼顾大小写敏感场景:
// ✅ 推荐使用:全局 + 忽略大小写 + 安全替换 document.addEventListener('DOMContentLoaded', function() { const oldDomain = '123456.com'; const newDomain = '67890.com'; // 选择所有 img 和 video 元素(含 poster 属性的 video) const elements = document.querySelectorAll('img[src], video[src], video[poster]'); elements.forEach(el => { // 同时处理 src 和 poster 属性(video 可能用 poster 显示封面) ['src', 'poster'].forEach(attr => { if (el.hasAttribute(attr)) { let url = el.getAttribute(attr); // 使用正则实现全局、忽略大小写的替换(更鲁棒) const regex = new RegExp(oldDomain.replace(/./g, '\.'), 'gi'); const updatedUrl = url.replace(regex, newDomain); if (updatedUrl !== url) { el.setAttribute(attr, updatedUrl); } } }); }); });
? 关键说明与注意事项: ✅ 自动生效 :将脚本添加到 Blogger 主题 HTML 的 或 底部(推荐在 前),所有文章页将自动执行替换; ✅ 安全替换 :使用 RegExp 并转义点号(. → .),防止误匹配 123456.com 被当作正则元字符;'gi' 标志确保全局且不区分大小写; ✅ 扩展性强 :如需同时处理 iframe[src](嵌入视频)或 a[href](外链),只需在 querySelectorAll() 中追加选择器,例如 'img[src], video[src], video[poster], iframe[src]'; ⚠️ 局限提示 :此方案为前端临时修复,不影响 Blogger 数据库中的原始 HTML;若追求永久修复(如 SEO 友好、离线可用),建议结合 Blogger 导出 XML → 批量文本替换 → 重新导入(需谨慎备份); ? 无副作用 :脚本仅修改存在且匹配的属性,不会改动其他 DOM 结构或触发重排,性能开销极低。 通过该脚本,你可在不触碰后台、不依赖插件的前提下,一键恢复全部失效媒体链接——简洁、可靠、即刻生效。

相关文章