Замените String на html-содержимое, используя javascript

Question

У меня есть эта строка из JSON «Я разработчик $ 1 $ frontend работает от $ 2 $ от $ 3 $".

Теперь я хочу, чтобы заменить $1$,$2$ и $3$ с динамическим HTML ввода текста boxes.So, вывод должен быть я

<-input textbox here> frontend developer works at <-input textbox here> from <-input textbox here>.

var str = "I am $1$ frontend developer works at $2$ from $3$"; 
var newStr = ""; 
for(var i=0;i<3;i++){ 
var id = '$'+i+'$'; 
if (str.indexOf(id) >= 0){ 
    newStr = str.replace(id, $.parseHTML('<div><input type="text" 
id="input-"+i/></div>')); 
} 

Я пытался использовать строку замены method.but кажется это будет работать только для strings.Any других метод можно использовать для достижения этого при помощи JavaScript/JQuery

Answer 1

<div id="div1"> 
    </div> 

    <script type="text/javascript"> 
var data = "I am $1$ frontend developer works at $2$ from $3$"; 
    //include jQuery before this code 
     $(function(){ 
     data.replace('$1$','<input type="text" />').replace('$2$','<input type="text" />').replace('$3$','<input type="text" />'); 
     }); 

    $('#div1').html(data); 
    </script> 

Answer 2

var input = "I am $1$ frontend developer works at $2$ from $3$"; 
var result = input.replace(/\$\d\$/g, '<div><input type="text" id="input-"+i/></div>'); 

В результате в настоящее время:

I am <div><input type="text" id="input-"+i/></div> frontend developer works at <div><input type="text" id="input-"+i/></div> from <div><input type="text" id="input-"+i/></div> 

Регулярное выражение, которое я использовал от комментария разместил @ n0m4d

Answer 3

Вы также можете попробовать что-то вроде этого:

var input = "I am $1$ frontend developer works at $2$ from $3$"; 
var result = replaceWithInputTags(input, '$') 

function replaceWithInputTags(source, templateChar){ 
    var sourceArgs = source.split(templateChar); 

    return sourceArgs.map(function(item){ 
     var index = +item; 
     if (isNaN(index)) return item; 
     return "<input type='text' id='input-" + (index-1) + "' />";  
    }).join(''); 
}