Je veux qu'un appel javascript (jQuery OK) change de quelque chose comme ça

<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>

En remplaçant les traits de soulignement (_) par un tiret (-)

L'objet peut être n'importe quel objet dom. Les classes avec des traits de soulignement sont générées à partir d'un autre système, qui ne peut pas être modifié de mon côté, tandis que le framework CSS (qui à nouveau ne peut pas être modifié) utilise des tirets dans les noms de classe.

0
ghosh'. 15 mars 2019 à 01:59

2 réponses

Meilleure réponse

Vous pouvez utiliser .querySelectorAll pour sélectionner tous les éléments qui ont une classe avec un trait de soulignement et remplacer ces classes par un trait d'union.

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>
3
ziggy wiggy 14 mars 2019 à 23:05

Itérer sur tous les éléments avec document.querySelectorAll('*')< /a>, puis utilisez String.prototype. replace(/_/g, '-') pour mettre à jour le className de chaque nœud DOM :

document.querySelectorAll('*').forEach(element => {
  element.className = element.className.replace(/_/g, '-');
  if (element.className.trim()) {
    console.log(element.tagName, '->', element.className);
  }
});
<div class="demo pass_no def_yes">
  <div class="demo pass_no def_yes"></div>
  <ul class="me lien_u lis__y"></ul>
</div>
<ul class="me lien_u lis__y"></ul>
0
jo_va 14 mars 2019 à 23:10