javascript - 将任何对象的类名称中的下划线替换为破折号

Question

我想要一个 javascript 调用(jQuery OK)来改变这样的事情

<div class="demo pass_no def_yes">.. </div>
...
<ul class="me lien_u lis__y"> ... </ul>

至

<div class="demo pass-no def-yes">.. </div>
...
<ul class="me lien-u lis--y"> ... </ul>

将下划线 (_) 替换为破折号 (-)

对象可以是任何 dom 对象。带下划线的类是从另一个系统生成的，我无法对其进行修改，而 CSS 框架(同样无法修改)在类名中使用破折号。

Answer 1

您可以使用 .querySelectorAll 选择具有带下划线的类的所有元素，并将这些类替换为连字符。

document.querySelectorAll("[class*='_']")
  .forEach(el => el.className = el.className.replace(/_/g, "-"))

.foo-bar-baz {
  color: green;
}

.foo_bar_baz {
  color: red;
}

<div class=foo_bar_baz>GREEN</div>