HTML 컨텐츠에서 태그를 제거하고 텍스트만 남기기

HTML 내용에서 태그를 제거하고 텍스트 내용만 재 가공해서 사용할 때 사용할 수 있는 함수입니다.

태그를 제거하면 중간에 줄바꿈과 공백, 탭과 같은 불필요한 문자들이 여러 개 겹쳐져 남게 됩니다.

이런 문자들까지 제거해야 텍스트 데이터를 사용할 수 있는 상태가 됩니다.

태그 제거

str.replace(/<\/?("[^"]*"|'[^']*'|[^>])*(>|$)/gi, "");

또는

str.replace(/(<([^>]+)>)/gi, "");

또는 블록 태그를 이용해 제거

    const div = document.createElement('div');
    div.innerHTML = str;
    str = div.textContent || div.innerText || '';

줄바꿈 제거

txt.split("\n").join("");

또는 입력 필드를 이용해 제거

const input = document.createElement('input');
input.value = str;
str = input.value;

공백 제거

2개 이상 연달아 있는 공백을 한개로 줄임

string.replace(/  +/g, ' ');

2개 이상 연달아 있는 공백, 줄바꿈, 탭을 공백 한개로 줄임

string.replace(/\s\s+/g, ' ');

함수로 정의해서 사용하면 간편하게 HTML 내용에서 텍스트만 한줄로 뽑아서 사용할 수 있습니다.

function stripTags(str){
    str = str.replace(/(<([^>]+)>)/gi, ""); // 태그 제거
    str = str.replace(/\s\s+/g, ' '); // 연달아 있는 줄바꿈, 공백, 탭을 공백 1개로 줄임
    return str;
}