jQuery menemukan dan mengganti string

Question 1

Saya memiliki suatu tempat di situs web teks tertentu, katakanlah "lollypops", dan saya ingin mengganti semua kemunculan string ini dengan "marshmellows". Masalahnya adalah saya tidak tahu di mana tepatnya teks itu. Saya tahu saya bisa melakukan sesuatu seperti:

$(body).html($(body).html().replace('lollypops', 'marshmellows'));

Ini mungkin akan berhasil, tetapi saya perlu menulis ulang HTML sesedikit mungkin, jadi saya memikirkan sesuatu seperti:

cari stringnya
temukan elemen induk terdekat
tulis ulang hanya elemen induk terdekat
ganti ini bahkan di atribut, tapi tidak semua, misalnya ganti di class, tapi tidak disrc

Sebagai contoh, saya akan memiliki struktur seperti ini

<body>
    <div>
        <div>
            <p>
               <h1>
                 <a>lollypops</a>
               </h1>
            </p>
            <span>lollypops</span>
        </div>
    </div>
    <p>
       <span class="lollypops">Hello, World!</span>
       <img src="/lollypops.jpg" alt="Cool image" />
    </p>
<body>

Dalam contoh ini, setiap terjadinya "lollypops" akan diganti, hanya <img src="...akan menjadi satu-satunya elemen yang akan benar-benar dimanipulasi akan sama dan <a>dan kedua <span>s.
Apakah ada yang tahu bagaimana melakukan ini?

Question 2

Anda bisa melakukan sesuatu seperti ini:

$("span, p").each(function() {
    var text = $(this).text();
    text = text.replace("lollypops", "marshmellows");
    $(this).text(text);
});

Akan lebih baik jika menandai semua tag dengan teks yang perlu diperiksa dengan nama kelas yang sesuai.

Juga, ini mungkin memiliki masalah kinerja. jQuery atau javascript secara umum tidak terlalu cocok untuk operasi semacam ini. Anda lebih baik melakukannya di sisi server.

Question 3

Anda bisa melakukan sesuatu dengan cara ini:

$(document.body).find('*').each(function() {
    if($(this).hasClass('lollypops')){ //class replacing..many ways to do this :)
        $(this).removeClass('lollypops');
        $(this).addClass('marshmellows');
    }
    var tmp = $(this).children().remove(); //removing and saving children to a tmp obj
    var text = $(this).text(); //getting just current node text
    text = text.replace(/lollypops/g, "marshmellows"); //replacing every lollypops occurence with marshmellows
    $(this).text(text); //setting text
    $(this).append(tmp); //re-append 'foundlings'
});

contoh: http://jsfiddle.net/steweb/MhQZD/

Question 4

Di bawah ini adalah kode yang saya gunakan untuk mengganti beberapa teks, dengan teks berwarna. Sederhana saja, ambil teksnya dan ganti di dalam HTMLtag. Ini berfungsi untuk setiap kata di tag kelas itu.

$('.hightlight').each(function(){
    //highlight_words('going', this);
    var high = 'going';
    high = high.replace(/\W/g, '');
    var str = high.split(" ");
    var text = $(this).text();
    text = text.replace(str, "<span style='color: blue'>"+str+"</span>");
    $(this).html(text);
});

Question 5

var string ='my string'
var new_string = string.replace('string','new string');
alert(string);
alert(new_string);

Question 6

Anda bisa melakukan sesuatu seperti ini:

HTML

<div class="element">
   <span>Hi, I am Murtaza</span>
</div>

jQuery

$(".element span").text(function(index, text) { 
    return text.replace('am', 'am not'); 
});

Question 7

Mengapa Anda tidak menambahkan kelas ke wadah string dan kemudian mengganti teks bagian dalam? Seperti contoh ini.

HTML:

<div>
    <div>
        <p>
           <h1>
             <a class="swapText">lollipops</a>
           </h1>
        </p>
        <span class="swapText">lollipops</span>
    </div>
</div>
<p>
   <span class="lollipops">Hello, World!</span>
   <img src="/lollipops.jpg" alt="Cool image" />
</p>

jQuery:

$(document).ready(function() {
    $('.swapText').text("marshmallows");
});

Answer 1

Saya memiliki suatu tempat di situs web teks tertentu, katakanlah "lollypops", dan saya ingin mengganti semua kemunculan string ini dengan "marshmellows". Masalahnya adalah saya tidak tahu di mana tepatnya teks itu. Saya tahu saya bisa melakukan sesuatu seperti:

$(body).html($(body).html().replace('lollypops', 'marshmellows'));

Ini mungkin akan berhasil, tetapi saya perlu menulis ulang HTML sesedikit mungkin, jadi saya memikirkan sesuatu seperti:

cari stringnya
temukan elemen induk terdekat
tulis ulang hanya elemen induk terdekat
ganti ini bahkan di atribut, tapi tidak semua, misalnya ganti di class, tapi tidak disrc

Sebagai contoh, saya akan memiliki struktur seperti ini

<body>
    <div>
        <div>
            <p>
               <h1>
                 <a>lollypops</a>
               </h1>
            </p>
            <span>lollypops</span>
        </div>
    </div>
    <p>
       <span class="lollypops">Hello, World!</span>
       <img src="/lollypops.jpg" alt="Cool image" />
    </p>
<body>

Dalam contoh ini, setiap terjadinya "lollypops" akan diganti, hanya <img src="...akan menjadi satu-satunya elemen yang akan benar-benar dimanipulasi akan sama dan <a>dan kedua <span>s.
Apakah ada yang tahu bagaimana melakukan ini?

Answer 2

Ada plugin yang ditulis dengan baik untuk mengganti teks. jquery-replacetext-plugin . Pengaya menggantikan teks yang membiarkan semua tag dan atribut tidak tersentuh. Anda juga dapat menemukan tutorial yang bagus untuk plug-in ini di spotlight-jquery-replacetext

Hussein

Answer 3

155

Anda bisa melakukan sesuatu seperti ini:

$("span, p").each(function() {
    var text = $(this).text();
    text = text.replace("lollypops", "marshmellows");
    $(this).text(text);
});

Akan lebih baik jika menandai semua tag dengan teks yang perlu diperiksa dengan nama kelas yang sesuai.

Juga, ini mungkin memiliki masalah kinerja. jQuery atau javascript secara umum tidak terlalu cocok untuk operasi semacam ini. Anda lebih baik melakukannya di sisi server.

kgiannakakis
sumber

Saya tahu, sayangnya saya tidak dapat melakukan ini di sisi server. Selain itu, solusi yang Anda sarankan tidak sesuai untuk saya, karena saya tidak tahu persis di mana letak stringnya. Mungkin di <span>, mungkin di <h4>dan seterusnya ...

cypher

Kemudian Anda dapat mencoba $ ("*"), tetapi saya tidak akan merekomendasikannya.

kgiannakakis

Answer 4

Saya tahu, sayangnya saya tidak dapat melakukan ini di sisi server. Selain itu, solusi yang Anda sarankan tidak sesuai untuk saya, karena saya tidak tahu persis di mana letak stringnya. Mungkin di <span>, mungkin di <h4>dan seterusnya ...

cypher

Answer 5

Kemudian Anda dapat mencoba $ ("*"), tetapi saya tidak akan merekomendasikannya.

kgiannakakis

Answer 6

Anda bisa melakukan sesuatu dengan cara ini:

$(document.body).find('*').each(function() {
    if($(this).hasClass('lollypops')){ //class replacing..many ways to do this :)
        $(this).removeClass('lollypops');
        $(this).addClass('marshmellows');
    }
    var tmp = $(this).children().remove(); //removing and saving children to a tmp obj
    var text = $(this).text(); //getting just current node text
    text = text.replace(/lollypops/g, "marshmellows"); //replacing every lollypops occurence with marshmellows
    $(this).text(text); //setting text
    $(this).append(tmp); //re-append 'foundlings'
});

contoh: http://jsfiddle.net/steweb/MhQZD/

Answer 7

Di bawah ini adalah kode yang saya gunakan untuk mengganti beberapa teks, dengan teks berwarna. Sederhana saja, ambil teksnya dan ganti di dalam HTMLtag. Ini berfungsi untuk setiap kata di tag kelas itu.

$('.hightlight').each(function(){
    //highlight_words('going', this);
    var high = 'going';
    high = high.replace(/\W/g, '');
    var str = high.split(" ");
    var text = $(this).text();
    text = text.replace(str, "<span style='color: blue'>"+str+"</span>");
    $(this).html(text);
});

Answer 8

2

var string ='my string'
var new_string = string.replace('string','new string');
alert(string);
alert(new_string);

Sai
sumber

1

Saya pikir tanda kutip di sekitar variabel string dalam fungsi 'ganti' perlu dihapus.

Jason Glisson

Answer 9

1

Saya pikir tanda kutip di sekitar variabel string dalam fungsi 'ganti' perlu dihapus.

Jason Glisson

Answer 10

Anda bisa melakukan sesuatu seperti ini:

HTML

<div class="element">
   <span>Hi, I am Murtaza</span>
</div>

jQuery

$(".element span").text(function(index, text) { 
    return text.replace('am', 'am not'); 
});

Answer 11

-3

Mengapa Anda tidak menambahkan kelas ke wadah string dan kemudian mengganti teks bagian dalam? Seperti contoh ini.

HTML:

<div>
    <div>
        <p>
           <h1>
             <a class="swapText">lollipops</a>
           </h1>
        </p>
        <span class="swapText">lollipops</span>
    </div>
</div>
<p>
   <span class="lollipops">Hello, World!</span>
   <img src="/lollipops.jpg" alt="Cool image" />
</p>

jQuery:

$(document).ready(function() {
    $('.swapText').text("marshmallows");
});

Dumitru Dimcenco
sumber

2

Ini adalah anak berusia 4 tahun dan sudah menjawab pertanyaan, tetapi masalahnya adalah saya tidak bisa melakukan apa yang Anda sarankan.

cypher

Jawaban ini sepenuhnya mengabaikan spesifikasi OP: "Saya ingin mengganti semua kemunculan string ini ... Masalahnya adalah saya tidak tahu di mana tepatnya teks itu."

Lukas

Answer 12

2

Ini adalah anak berusia 4 tahun dan sudah menjawab pertanyaan, tetapi masalahnya adalah saya tidak bisa melakukan apa yang Anda sarankan.

cypher

Answer 13

Jawaban ini sepenuhnya mengabaikan spesifikasi OP: "Saya ingin mengganti semua kemunculan string ini ... Masalahnya adalah saya tidak tahu di mana tepatnya teks itu."

Lukas

jQuery menemukan dan mengganti string

Jawaban: