일관된 사용자 생성 콘텐츠 표시를 위해 JavaScript로 HTML 엔터티를 인코딩하는 방법은 무엇입니까?

JavaScript에서 HTML 엔터티 인코딩

사용자 생성 콘텐츠로 작업할 때 ®, &, © 및 ™과 같은 엔터티가 표시되지 않을 수 있습니다. 브라우저 전반에 걸쳐 일관되게. JavaScript는 이러한 엔터티를 HTML로 인코딩하는 여러 가지 방법을 제공합니다.

HTML 엔터티로 변환

기호를 해당 HTML 엔터티로 변환하려면 다음 코드를 사용하세요.

<code class="js">var encodedStr = rawStr.replace(/[\u00A0-\u9999<>\&amp;]/g, function(i) {
   return '&amp;#'+i.charCodeAt(0)+';';
});</code>

위 첨자로 표시

인코딩된 엔터티를 사용자 정의 스타일을 사용하여 위 첨자로 표시하려면 CSS를 사용하세요.

<code class="css">sup {
  font-size: 0.6em;
  padding-top: 0.2em;
}</code>

구현 예

<code class="js">var regs = document.querySelectorAll('®');
for (var i = 0, l =regs.length; i < l; ++i ) {
  var div = document.createElement('sup');
  var text = document.createTextNode(encodedStr);
  div.appendChild(text);
  regs[i].parentNode.insertBefore(div);
}</code>

이 코드는 다음과 같습니다.

1. ® 기호가 있는 모든 요소를 ​​선택합니다.
2. sup 요소를 생성하고 선택한 요소 앞에 추가합니다.
3. 인코딩된 HTML 엔터티를 sup 요소에 추가합니다.

추가 고려 사항

• UTF8 문자 인코딩 및 데이터베이스 저장소를 사용하여 올바르게 표시되는지 확인하세요.
• 브라우저 글꼴 구성은 여전히 ​​특정 문자의 모양에 영향을 미칠 수 있습니다.

문서

• String.charCodeAt : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/charCodeAt
• HTML 문자 엔터티: http://www.chucke.com/entities. HTML

위 내용은 일관된 사용자 생성 콘텐츠 표시를 위해 JavaScript로 HTML 엔터티를 인코딩하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!