네이버스마트에디터 스타일 및 이미지 제거 후 문자열만 추출하기

네이버 에디터에 작성된 게시글 중 텍스트 문자열만 따로 저장하게 해달라는 요구사항이 있었습니다.

그래서 직접 구현을 했는데 다 하고 나서 네이버 스마트에디터 js 파일을 열어보니 비슷한 기능이 있었다는.. ㅠ0ㅠ 

하지만 다른 곳에서도 사용할 수 있을 것 같아서 기록으로 남기게 되었습니다.

- 공통 함수

/**

 * argBody 안의 내용 중 지정 문자열 삭제

 * argBody : 삭제본문 ( ex : 가나다 <pre style="width:100px">안녕하세요</pre> )

 * argStartSection : 삭제 시작 문자 ( ex : <pre )

 * argEndSection : 삭제 끝 문자 ( ex : ;"> )

 * argRemoveSection : 별도 replace 문자 ( ex : </pre> )

  */

var removeStyleAndImage  = function(argBody, argStartSection, argEndSection, argRemoveSection){

    var bodyString = argBody;

    var sectionChk = bodyString.match(new RegExp(argStartSection,'g'));

    if(sectionChk != null){

        for(var i=0; i < sectionChk.length; i++){

            var tmpImg = bodyString.substring(bodyString.indexOf(argStartSection), (bodyString.indexOf(argEndSection)+(argEndSection.length)));

            bodyString = bodyString.replace(tmpImg, '').replace(/<br>/gi, '').replace(/&nbsp;/gi, ' ').replace(/<p>/gi, '').replace(/<\/p>/gi, ' ').replace(new RegExp(argRemoveSection,'gi'), '');

        }

    }

    return bodyString;

};

파라미터로 각 데이터를 받아서 html 및 이미지 제거 후 string 값만 리턴합니다.

- 호출 하기

    $('#btnSave').on('click', function(){

        var varContent = oEditors.getById["taEvdnimgFullCnt"].getIR();

        varContent = removeStyleAndImage(varContent, '<img src=', '">', '');      // 스마트에디터 내부의 이미지 제거

        varContent = removeStyleAndImage(varContent, '<pre', ';">', '</pre>');    // 스마트에디터 내부의 스타일 제거

        varContent = removeStyleAndImage(varContent, '<span', ';">', '</span>');  // 스마트에디터 내부의 스타일 제거

    });

이렇게 하면 varContent 에는 string 문자열만 남게 됩니다.

이상입니다.