[javascript] db에서 가져온값 <br/> 처리

문제 해결 과정

 

dhtmlx로 프로젝트 개발중

db에서 뽑아온 값에 html에서 엔터처리가 <br/>로 나오게 되어 문제가 생겼다.

 

문제를 발견하고 처음에는

back에서 처리해서 view로 보내줄려고 했지만 이상하게 sysout을 해보면 console창에는

br태그는 보이지 않고 엔터처리가 되어 나오고

front에서만 br태그가 나왔다. 그러므로 javascript로 front에서 작업을 하게 되었다.

 

결국은 아래와 같이 해결은 되었지만... 

점심먹고 돌아와 인터넷 복붙으로 만들어 놓은 코드 복습해볼려고 다 지우고

result.v_desc만 뽑아보니 정상적으로 나온다...??

정말 다른건 건들지도 않고 br태그가 나온 그 코드로 돌아가서 다시 한번 뽑아본 것 뿐인데??

코딩에도 기도가 필요한 이유를 알 것만 같다.  

 

index.html

  $.ajax({
      url : ~,
      type: "Post",  
      dataType : "json",
      data : data,
      success : function(result){
        
        //db에 있는 값을 가져왔는지 확인 
        if(result.v_desc != null && result.v_desc != ""){

          //가져온값에 <br/>이 포함 되어 있는지 indexOf로 확인 
          // 문자열에 <br/>이 포함되어있으면 문자열 내에서 <br/> 문자열의 index 값을 리턴한다.
          // 없으면 -1 return
          var isBrTag = result.v_desc.indexOf("<br/>"); 
          console.log(isBrTag); 

          if(isBrTag > 0) {
            var desc = result.v_desc.replace(/(<br\/>)/g, '\r\n'); 
            /* 
              javascript는 replaceAll이 없기 때문에 replace를 그냥 사용하면 문자열내에 br태그를 하나밖에 제거를 
              못 한다. 그러므로 위와같이 javascript 표현식 [g] 로 문자열내에 모든 <br/>를 검색해서 바꿔줘야 한다.
            */
            console.log(desc); // 값 확인
         }

        }
          
      },
      error : function(xhr){
        console.log(xhr.message);
      }
      });