jQuery를 사용하여 동적으로 로드된 콘텐츠 내에서 특정 텍스트 문자열을 효율적으로 굵게 표시하려면 어떻게 해야 합니까?

jQuery로 텍스트 문자열 찾기 및 굵게 표시

요소 내에서 특정 텍스트 문자열을 찾고 그 모양을 수정하는 것은 작업 시 일반적인 작업입니다. 동적 콘텐츠. jQuery에서는 이를 효율적으로 수행할 수 있습니다. 그러나 초기 접근 방식으로 원하는 결과를 얻을 수 없는 경우 문제를 해결하고 해결책을 찾아보세요.

제공하신 코드 스니펫은 ID가 " about_theresidency." 의도는 분명하지만 구현에 작은 오류가 있습니다.

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

문제는 ":contains" 선택기에 있으며, 설명하신 대로 텍스트가 동적으로 로드될 때 제대로 작동하지 않습니다. . 원하는 텍스트를 효과적으로 타겟팅하기 위해 html()과 함께 replacement() 함수를 사용할 수 있습니다.

var html = $('p').html();
$('p').html(html.replace(/cross genre/gi, '<strong>$&</strong>'));

이 코드는 "장르 간" 텍스트를 강력한 태그 버전으로 대체하여 효과적으로 굵게 표시합니다.

또는 이 기능을 캡슐화하는 사용자 정의 플러그인을 만들 수도 있습니다.

$.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']
});

이 플러그인을 사용하면 이제 WrapInTag() 메서드를 사용하여 지정된 단어를 원하는 태그로 묶을 수 있습니다(예: 강조는 'em', 굵은 글씨는 'strong').

이러한 수정 사항을 통합하면 텍스트를 효율적으로 찾고 수정할 수 있습니다. jQuery 코드에 문자열을 추가하여 동적 콘텐츠가 원하는 스타일로 표시되도록 합니다.

위 내용은 jQuery를 사용하여 동적으로 로드된 콘텐츠 내에서 특정 텍스트 문자열을 효율적으로 굵게 표시하려면 어떻게 해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!