Захватите строку из более чем одного слова и превратите ее в одну строку, разделенную тире

Question

Я работаю с сайтом WordPress.Я сделал функцию с javascript, которая добавляет класс к тегу body, который позволяет отображать другой фон в соответствии с категорией.Это хорошо работает, когда категория является одним словом.Но когда у меня есть категория, состоящая из двух или более слов, она перестает работать.Это код:

 ( window.onload=function() {
   let cat =   document.querySelector('.cats').lastElementChild.textContent;
   let body = document.querySelector('body');  

   if(cat.indexOf(' ') >= 0) {
   cat.replace(' ','-');

   body.classList.add(cat.toLowerCase());
   } else {

   body.classList.add(cat.toLowerCase());
   }

   })();

Если категория «дантист», то эта строка добавляется в тег body, но если это «Общий доктор», она больше не работает.

Я использую functions.php, чтобы вызывать эту функцию только тогда, когда это сообщение с использованием if_single ().

Я пытаюсь использовать replace () для замены пробела, но я не правильно его реализую.

Что я могу сделать, чтобы что-то вроде "General Physician" можно было преобразовать в строку типа "general-doctor", которая может быть добавлена ​​в качестве класса в тег body?

Answer 1

Когда вы используете замену, значение строки не изменится.Попробуйте это:

cat = cat.replace(/ /g,'-');

Answer 2

Сначала querySelector перехватывает только первый встреченный селектор.Если вы хотите проверить каждый элемент с этим именем класса, используйте вместо него querySelectorAll или getElementsByClassName.

Second, связанный с вашим вопросом, таким образом, replace заменяет только первое вхождение.Вы должны заменить это на:
cat.replace(/\s/g, "");

Но вы также должны переназначить его:
cat = cat.replace(/\s/g, "");