JS/jQuery实现URL多字符全局批量替换 支持äöüß等特殊字符

你当前编写的jQuery代码已经可以实现URL中空格全局替换为下划线的效果，代码如下：

jQuery("td.ninja_column_0.ninja_clmn_nm_film.footable-first-visible a").each(function(){
var newUrl = jQuery(this).attr('href').split(' ').join('_');
jQuery(this).attr("href", newUrl);
});

目前需要额外实现URL中ä、ö、ü、ß等特殊字符的替换，不想通过重复编写多段同逻辑替换代码实现，需要更简洁优雅的方案。

补充踩坑记录：最初使用var newUrl = jQuery(this).attr('href').replace(' ', '_');实现空格替换时，因为传入replace的第一个参数是字符串，仅能替换第一个匹配到的空格，无法实现全局替换效果。

最易维护且简洁的实现方式是统一维护字符映射表+正则全局匹配，一次遍历就能完成所有字符替换，后续新增替换规则也不需要修改核心逻辑。
完整代码如下：

// 所有待替换字符和替换后内容的映射表，新增规则直接在这里加键值对即可
const charReplaceMap = {
  ' ': '_',
  'ä': 'ae',
  'ö': 'oe',
  'ü': 'ue',
  'ß': 'ss'
};

jQuery("td.ninja_column_0.ninja_clmn_nm_film.footable-first-visible a").each(function(){
  const $link = jQuery(this);
  const originalHref = $link.attr('href');
  // 生成匹配所有待替换字符的全局正则
  const matchReg = new RegExp(`[${Object.keys(charReplaceMap).join('')}]`, 'g');
  const finalHref = originalHref.replace(matchReg, (matchChar) => charReplaceMap[matchChar]);
  $link.attr('href', finalHref);
});

方案优势 #

• 替换规则集中管理：后续如果需要新增其他特殊字符替换、调整替换规则，只需要修改charReplaceMap的内容即可，不需要反复链式调用replace方法
• 执行效率更高：正则全局匹配只需要遍历一次字符串就能完成所有替换，比多次调用replace的性能更好
• 从根源规避了字符串参数下replace仅匹配第一个内容的问题

如果需要兼容大写的Ä/Ö/Ü，直接在映射表中追加对应键值对即可，比如'Ä': 'Ae'、'Ö': 'Oe'、'Ü': 'Ue'，核心替换逻辑不需要做任何改动。

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