Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Menebalkan Teks Khusus Dalam Perenggan Menggunakan jQuery?

Bagaimanakah Saya Boleh Menebalkan Teks Khusus Dalam Perenggan Menggunakan jQuery?

Barbara Streisand
Lepaskan: 2024-12-08 07:09:11
asal
560 orang telah melayarinya

How Can I Bold Specific Text Within a Paragraph Using jQuery?

Memanipulasi Teks dengan jQuery: Mendorong Rentetan Khusus

Dalam jQuery, pengguna sering menghadapi keperluan untuk mencari teks tertentu dalam dokumen dan mengubah suainya penampilan. Satu senario biasa ialah menambah penekanan pada teks tertentu dengan menjadikannya tebal.

Pertimbangkan kod jQuery berikut yang cuba memberi semangat kepada frasa tertentu dalam perenggan dengan ID "about_theresidency":

` `
$(window).load(function() {
$('#about_theresidency:contains("cross genre")').css({'font-weight':'bold'});
});
``

Kod ini bertujuan untuk mencari elemen dengan ID "about_theresidency" yang mengandungi teks "cross genre" dan kemudian menggunakan sifat CSS "font-weight" untuk menebalkan teks khusus tersebut. Walau bagaimanapun, kod ini mungkin tidak berfungsi seperti yang dimaksudkan kerana sifat dinamik teks dalam "about_theresidency."

Untuk menyelesaikan isu ini, pertimbangkan untuk menggunakan pendekatan berikut:

var html = $('p').html();
$('p').html(html.replace(/world/gi, '<strong$&</strong>'));
Salin selepas log masuk

Di sini, kami memanfaatkan kaedah replace() untuk mencari semua kemunculan teks "dunia" dalam perenggan dan menggantikannya dengan teks yang sama yang dikelilingi oleh teg yang kuat. Ini secara berkesan menebalkan teks yang diingini tanpa bergantung pada pemilih :contains jQuery.

Sebagai alternatif, anda boleh menggunakan pemalam jQuery tersuai untuk lebih fleksibiliti:

$.fn.wrapInTag = function(opts) {

  var tag = opts.tag || 'strong'
    , words = opts.words || []
    , regex = RegExp(words.join('|'), 'gi') // case insensitive
    , replacement = '<'+ tag +'>$&</'+ tag +'>';

  return this.html(function() {
    return $(this).text().replace(regex, replacement);
  });
};

// Usage
$('p').wrapInTag({
  tag: 'em',
  words: ['world', 'red']
});
Salin selepas log masuk

Pemalam ini membolehkan anda membungkus mana-mana yang ditentukan teks dalam mana-mana teg HTML yang dikehendaki, memberikan kawalan yang lebih besar ke atas proses manipulasi teks.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menebalkan Teks Khusus Dalam Perenggan Menggunakan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan