Замена Javascript добавляет несколько к началу и концу строки

#javascript #regex

#javascript #регулярное выражение

Вопрос:

Я использую Javascript для добавления <br /> между каждой буквой текста в теге. Код выглядит следующим образом:

 $(this).html($(this).text().replace(/(.{1})/g, "$1<br />"));
  

Это добавляет несколько дополнительных <br /> тегов к началу и концу строки, поэтому вместо превращения Asia в

A<br />s<br />i<br />a

В итоге я получаю

<br /><br /><br /><br /><br /><br /><br /><br />A<br />s<br />i<br />a<br /><br /><br /><br /><br /><br /><br /><br />

Помогите!

Редактировать: нет начальных или конечных пробелов. Это просто <h1>Asia</h1> .

Ответ №1:

Вместо того, чтобы использовать . который соответствует любому символу, если вам нужны буквы, почему бы не сделать что-то вроде:

 $(this).html($(this).text().replace(/(w{1})/g, "$1<br />"));
  

Комментарии:

1. Это сделало это! Я не уверен, чему это соответствовало, но замена . на w исправила это!

2. @Chris Patten: . соответствует любому символу (включая пробел), тогда как w соответствует буквенно-цифровому. Похоже, у вас там много избыточного пробела, поэтому, возможно, стоит последовать некоторым другим предложениям и это тоже очистить.

Ответ №2:

Попробуйте обрезать свой текст, так как это могут быть пробелы:

 $(this).html(jQuery.trim($(this).text()).replace(/(.{1})/g, "$1<br />"));
  

Ответ №3:

Вероятно, у вас есть куча начальных и завершающих пробелов, возвращающихся из .text . Вам следует убрать пробелы перед вставкой ваших <br> тегов:

 var $this = $(this);
var t  = $this.text().replace(/^s*/, '').replace(/s*$/, '');
$this.html(t.replace(/(.{1})/g, "$1<br />"));
  

Или живой пример:http://jsfiddle.net/ambiguous/LAH99 /

Ответ №4:

С помощью regex легко сделать ваш код неясным, поэтому я написал версию со String.split() и Array.join()

 var $this = $(this);
var text = $(this).text();
var arr = text.split('');
for( var i = 0; i < arr.length -1; i   ) {
    arr[ i ]  = '<br />';
}
$this.text( arr.join('') );