не может удалить символ backsla sh или дефис из строки с jQuery

Question

Я пытаюсь получить текущий URL и заменить его текстом элемента h1 и добавить пробелы между словами. URL-адреса содержат обратную косую черту и дефисы, поэтому мне нужно их удалить. Я пытался удалить их, но мой код не работал. Спасибо!

$(document).ready(function () {

    //var newTitle = window.location.pathname; 
    var newTitle = '/fall-2012';
    newTitle.replace('-', ' ');
    newTitle.replace('/',' ');

   $('h1').hide();
   $('h1').text(newTitle);
   $('h1').show();

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Old Title</h1>

Answer 1

JavaScript строки являются неизменяемыми, поэтому вам необходимо присвоить результат замены исходной строке:

var newTitle = '/fall-2012';
newTitle = newTitle.replace(/[\/-]+/g, '');
console.log(newTitle);

Обратите внимание, что я решил использовать здесь замену регулярного выражения, нацеливаясь на forward sla sh и da sh в одном go, что позволяет избежать нескольких вызовов без регулярных выражений replace.

Answer 2

In javascript, strings are immutable. No string methods change the string they operate on, they all return new strings.

Если требование заменить дефис и обратную косую черту sh пробелом при их первом появлении в URL, добавьте следующий код:

$(document).ready(function() {
  //var newTitle = window.location.pathname; 
  var newTitle = '/fall-2012';
  newTitle = newTitle.replace('-', ' ').replace('/', ' ');
  $('h1').hide();
  $('h1').text(newTitle);
  $('h1').show();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Old Title</h1>

И если требуется заменить каждое вхождение дефиса и обратного слова sh пробелом в URL, то вам поможет следующее:

$(document).ready(function() {
  //var newTitle = window.location.pathname; 
  var newTitle = '/fall-2012';
  newTitle = newTitle.replace(/[-/]/g, ' ');
  $('h1').hide();
  $('h1').text(newTitle);
  $('h1').show();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Old Title</h1>

Answer 3

Причина в том, что строки неизменяемы - они не могут изменяться, мы можем только создавать новые строки.

String.prototype.replace ( )

Метод replace() возвращает новую строку с некоторыми или всеми совпадениями шаблона, замененными заменой. Шаблон может быть строкой или RegExp, а замена может быть строкой или функцией, вызываемой для каждого совпадения. Если шаблон является строкой, будет заменено только первое вхождение.

Исходная строка остается без изменений.

Вы можете сделать это с помощью одного replace(), используя RegExp, следующим образом:

$(document).ready(function () {

    //var newTitle = window.location.pathname; 
    var newTitle = '/fall-2012';
    newTitle = newTitle.replace(/[-/]/g, ' ');

   $('h1').hide();
   $('h1').text(newTitle);
   $('h1').show();

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Old Title</h1>

Answer 4

Вы можете сделать это так

var newTitle = '/fall-2012';
newTitle = newTitle.replace('-', ' ');
newTitle = newTitle.replace('/', ' ');
console.log(newTitle)

Если вам не нужно пространство , вы можете сделать это так

var newTitle = '/fall-2012';
newTitle = newTitle.replace('-', '');
newTitle = newTitle.replace('/', '');
console.log(newTitle)

Answer 5

Пожалуйста, попробуйте это

$(document).ready(function () {

    //var newTitle = window.location.pathname; 
    var newTitle = '/fall-2012';
    newTitle=newTitle.replace('-', ' ').replace('/',' ');
    
   $('h1').hide();
   $('h1').text(newTitle);
   $('h1').show();

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h1>Old Title</h1>

Answer 6

Вы можете сделать с .replace(/[\/-]+/g, '')

Answer 7

Вы можете использовать класс символов.

$(document).ready(function () {

    //var newTitle = window.location.pathname; 
    var newTitle = '/fall-2012';
    newTitle = newTitle.replace(/[/-]/g,'');

   $('h1').hide();
   $('h1').text(newTitle);
   $('h1').show();

});

Fiddle link