Mencari dan Menebalkan Rentetan Teks dengan jQuery
Mencari rentetan teks tertentu dalam elemen dan mengubah suai penampilannya adalah tugas biasa apabila bekerja dengan kandungan dinamik. Dalam jQuery, mencapai ini boleh dilakukan dengan cekap. Walau bagaimanapun, jika pendekatan awal anda tidak menghasilkan hasil yang diingini, mari kita selesaikan masalah dan cari penyelesaian.
Coretan kod yang anda berikan bertujuan untuk menebalkan teks yang mengandungi rentetan "genre silang" dalam elemen dengan ID " tentang_kediaman." Walaupun niatnya jelas, terdapat ralat kecil dalam pelaksanaannya:
$('#about_theresidency:contains("cross genre")').css({'font-weight':'bold'});
Isunya terletak pada pemilih ":contains", yang tidak berfungsi dengan baik apabila teks dimuatkan secara dinamik seperti yang telah anda huraikan . Untuk menyasarkan teks yang diingini dengan berkesan, kita boleh menggunakan fungsi replace() bersama-sama dengan html():
var html = $('p').html(); $('p').html(html.replace(/cross genre/gi, '<strong>$&</strong>'));
Kod ini menggantikan teks "genre silang" dengan versi teg yang kuat, dengan berkesan menebalkannya.
Sebagai alternatif, anda juga boleh mencipta pemalam tersuai untuk merangkum fungsi ini:
$.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'] });
Dengan pemalam ini, anda kini boleh menggunakan kaedah wrapInTag() untuk membungkus perkataan yang ditentukan dalam teg yang diingini, cth., 'em' untuk penekanan atau 'strong' untuk tebal.
Dengan memasukkan pembetulan ini, anda boleh mencari dan mengubah suai teks dengan cekap. rentetan dalam kod jQuery anda, memastikan kandungan dinamik dipersembahkan dengan gaya yang diingini.
Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menebalkan Rentetan Teks Khusus dengan Cekap dalam Kandungan Dimuat Secara Dinamik Menggunakan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!