replaceを使って複数回出現する文字列を置換するjs

最初の1個しか置換されない

ほげほげほげほげほげほげほげほげほげほげ

クリックしたら「ほげ」を「もげ」に置換

$(function(){
    'use scrict';
　　　　
　　　　$('p.hoge-btn a').click(function(){
　　　　　　　　var $hoge = $('p.hoge').html();
　　　　　　　　$('p.hoge').html($hoge.replace('ほげ','もげ'));
　　　　　　　　return false;
　　　　});
　　　　
});

該当の文字は全て置換される

もげもげもげもげもげもげもげもげもげもげもげ

クリックしたら「もげ」を「ふが」に置換

$(function(){
    'use scrict';
　　　　
　　　　$('p.moge-btn a').click(function(){
　　　　　　　　var $moge = $('p.moge').html();
　　　　　　　　$('p.moge').html($moge.replace(/もげ/g,'ふが'));
　　　　　　　　return false;
　　　　});
　　　　
});

文字列を複数指定して置換することもできる

ほげほげほげほげほげもげもげもげもげもげ

クリックしたら「ほげ」も「もげ」も「ふが」に置換

$(function(){
    'use scrict';

　　　　$('p.fuga-btn a').click(function(){
　　　　　　　　var $fuga = $('p.fuga').html();
　　　　　　　　$('p.fuga').html($fuga.replace(/ほげ|もげ/g,'ふが'));
　　　　　　　　return false;
　　　　});
　　　　
});

デモの解説記事に戻る