>웹 프론트엔드 >JS 튜토리얼 >htmlencode() 및 htmldecode() 함수를 구현하기 위한 자바스크립트 대체 방법 분석 예

htmlencode() 및 htmldecode() 함수를 구현하기 위한 자바스크립트 대체 방법 분석 예

高洛峰
高洛峰원래의
2016-12-06 15:11:531259검색

이 기사의 예에서는 htmlencode() 및 htmldecode() 함수를 구현하는 JavaScript의 대체 방법을 설명합니다. 참고할 수 있도록 자세한 내용은 다음과 같습니다.

가장 일반적인 방법은 < > htmlencoding.을 사용하지만, 일반적인 a8093152e673feb7aba1828c43532094& 외에도 ©"®, 뿐만 아니라 AB 중국어 또는 중국어와 같은 문자의 10진수 또는 16진수 인코딩으로 표현된 이스케이프를 모두 열거하기 어렵습니다. 이를 하나씩 대체하는 것은 길고 비효율적일 뿐만 아니라 일부 문자를 놓치기 쉽습니다.

코드는 다음과 같습니다.

function htmlencode(s){
  var div = document.createElement(&#39;div&#39;);
  div.appendChild(document.createTextNode(s));
  return div.innerHTML;
}
function htmldecode(s){
  var div = document.createElement(&#39;div&#39;);
  div.innerHTML = s;
  return div.innerText || div.textContent;
}

아주 간단합니다!

코딩 원칙은 TextNode 노드를 생성하여 연결하는 것입니다. 그런 다음 컨테이너의 innerHTML을 가져옵니다.

디코딩 원칙은 문자열을 컨테이너의 innerHTML에 할당한 다음 innerText 또는 textContent를 가져오는 것입니다.

테스트해 보세요. :

//测试
document.onclick = function (){
  //<p> & </p>
  alert(htmlencode(&#39;<p> & </p>&#39;));
  //<p> & © ABC 中文 中文 </p>
  alert(htmldecode(&#39;<p> & © ABC 中文 中文 </p>&#39;));
}

효과는 좋습니다.

htmldecode에는 입력 매개변수에 대한 요구사항이 있습니다. 예상한 결과가 나오지 않을 수도 있습니다.

Google에서 검색하여 cnblogs에서 하나를 찾았습니다. 다른 사람도 이미 이렇게 생각한 것으로 나타났습니다 =||=. htmldecode 코드가 잘못되었습니다.


성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.