JavaScript에서 HTML 문자를 효과적으로 이스케이프하는 방법은 무엇입니까?

JavaScript에서 HTML 문자 이스케이프를 수행하는 방법

JavaScript에서 HTML 데이터로 작업할 때 <와 같은 특수 문자를 이스케이프해야 하는 경우가 많습니다. ;, >, &는 마크업 구문으로 해석되는 것을 방지합니다. PHP는 이 목적을 위해 htmlspecialchars라는 기본 함수를 제공하지만 JavaScript에는 이에 상응하는 기능이 없습니다.

HTML 문자 이스케이프 함수 구현

htmlspecialchars의 기능을 에뮬레이트하려면 JavaScript에서는 사용자 정의 함수를 만들 수 있습니다. 그러나 가능한 경우 내장 함수를 사용하는 것이 좋습니다.

ES6 템플릿 리터럴

ES6에서는 HTML 문자를 이스케이프하는 편리한 방법을 제공하는 템플릿 리터럴을 도입했습니다. 그러나 이 접근 방식은 각 특수 문자의 첫 번째 발생만 이스케이프하므로 동일한 문자의 여러 인스턴스가 포함된 문자열에 대해 잘못된 결과가 발생합니다.

사용자 정의 대체 함수

적절한 이스케이프를 보장하려면 사용자 정의 대체 기능을 사용할 수 있습니다. 이 기능은 각 특수 문자를 해당 HTML 엔터티로 바꿉니다.

function escapeHtml(text) {
  return text
      .replace(/&/g, "&")
      .replace(/</g, "&amp;lt;")
      .replace(/>/g, "&amp;gt;")
      .replace(/&quot;/g, "&amp;quot;")
      .replace(/'/g, "&#039;");
}

문자표 사용

큰 텍스트 블록의 성능을 향상하려면 문자표를 다음과 같이 사용할 수 있습니다. 특수 문자를 보다 효율적으로 바꾸는 데 사용됩니다.

function escapeHtml(text) {
  var map = {
    '&': '&',
    '<': '&amp;lt;',
    '>': '&amp;gt;',
    '&quot;': '&amp;quot;',
    "'": '&#039;'
  };
  
  return text.replace(/[&amp;<>&quot;']/g, function(m) { return map[m]; });
}

이러한 기술을 사용하면 JavaScript에서 HTML 문자를 효과적으로 이스케이프 처리할 수 있습니다. HTML 문서에서는 올바르게 표시됩니다.

위 내용은 JavaScript에서 HTML 문자를 효과적으로 이스케이프하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!