programing

jQuery로 HTML 태그를 제거하는 방법?

testmans 2023. 10. 12. 22:16
반응형

jQuery로 HTML 태그를 제거하는 방법?

문자열에서 HTML 태그를 제거하고 싶습니다.예를 들어 문자열이 있다고 가정합니다.

 <p> example ive got a string</P>

다음을 제거하는 함수를 작성하려면 어떻게 해야 합니까?<p><p>'example 아이브가 줄을 잡았다'고요?

다음 기능을 사용합니다.

var text = $("<p> example ive got a string</P>").text();

업데이트: 아래 Brilliand가 지적한 바와 같이 입력 문자열에 태그가 포함되어 있지 않고 운이 나쁘면 CSS 셀렉터로 처리될 수 있습니다.따라서 이 버전은 보다 강력합니다.

var text = $("<div/>").html("<p> example ive got a string</P>").text();

가장 안전한 방법은 텍스트 노드 브라우저에 의존하여 콘텐츠를 올바르게 탈출하는 것입니다.예는 다음과 같습니다.

function encodeHTML(dirtyString) {
  var container = document.createElement('div');
  var text = document.createTextNode(dirtyString);
  container.appendChild(text);
  return container.innerHTML; // innerHTML will be a xss safe string
}

document.write( encodeHTML('<p>some <span>content</span></p>') );
document.write( encodeHTML('<script><p>some <span>content</span></p>') );

여기서 기억해야 할 점은 우리가 html 문자열에 접근할 때 브라우저가 TextNode의 특수 문자를 벗어난다는 것입니다 (innerHTML,outerHTML). 이에 비해 텍스트 값에 접근(innerText,textContent)는 안전하지 않고 XSS를 포함할 수 있는 원시 문자열을 생성합니다.

jQuery를 사용하는 경우 사용합니다..text()안전하고 역호환성이 있습니다.이 질문에 대한 다른 답변을 참조하십시오.

순수 자바스크립트에서 브라우저 <= Internet Explorer 8>로 작업하는 가장 간단한 방법은 다음과 같습니다.

string.replace(/(<([^>]+)>)/ig,"");

하지만 regex로 HTML을 파싱하는 것은 문제가 있어서 이것은 그다지 좋은 보안을 제공하지 못할 것입니다.또한, 이것은 HTML 문자만 다루기 때문에 완전히 xss 안전하지는 않습니다.

이것은 URL 이미지를 가져오고 일부 항목에서 p 태그를 탈출하는 예입니다.

시도해 보기:

$('#img').attr('src').split('<p>')[1].split('</p>')[0]

만약 당신이 그 안을 유지하고 싶다면.요소의 HTML로 가장 바깥쪽 태그만 제거하면 다음 작업을 수행할 수 있습니다.

$(".contentToStrip").each(function(){
  $(this).replaceWith($(this).html());
});

기존 스플릿 기능을 사용하실 수 있습니다.

하나의 쉽고 빠른 예:

var str = '<p> example ive got a string</P>';
var substr = str.split('<p> ');
// substr[0] contains ""
// substr[1] contains "example ive got a string</P>"
var substr2 = substr [1].split('</p>');
// substr2[0] contains "example ive got a string"
// substr2[1] contains ""

이 예는 분할이 어떻게 작동하는지 보여주기 위한 것입니다.

언급URL : https://stackoverflow.com/questions/13140043/how-to-strip-html-tags-with-jquery

반응형