innerHTML을

Question

를 사용하여 렌더링 내용의 줄 바꿈을 렌더링하는 JS 활용하는 방법을 여기

바이올린 - 기본적으로 http://jsfiddle.net/kQ3eJ/3/

var string = "This is a & string that has \n new lines in it\u0027s body"; 

//does not do the newline or unicode 
document.getElementById("insertJavascript").innerHTML = string; 

//does do the newline and unicode 
document.getElementById("insertJavascriptWithPre").innerHTML = '<pre>' + string + '</pre>'; 

//but if i get the string from the HTML to begin with it doesn't work 
var htmlString = document.getElementById("htmlWithNewline").textContent; 
document.getElementById("insertJsHtmlWithNewline").textContent = htmlString; 

웹 페이지 누구의 innerHTML을의 (a JSON 데이터) 거기에 줄 바꿈을 가지고 나는이를 포맷하려는 요소가 데이터이므로 프런트 엔드에서 더 읽기 쉽습니다.

바이올린에서 볼 수 있듯이 - 개행 문자 (\ n)를 자바 스크립트로 입력하지만 개행 문자가 innerHTML에서 오는 문자열의 일부인 경우 형식이 올바로 지정되지 않습니다.

문자열의 줄 바꿈을 "이스케이프 해제"할 수있는 방법이 있습니까? 좋아

는 그래서 "\ r에"와 "\ n을"과 "\ r에"와 "\ n을"을 대체 문자열로 시도하고 그

var what = htmlString.replace('\\n','\n'); 
// what = what.replace('\\u','\u'); 
what = what.replace('\\r','\r'); 
document.getElementById("a").innerHTML = '<pre>' + what + '</pre>'; 

을 일한 것 같다하지만 유니 코드에 실패한 것 바꾸기 - 전체 유니 코드 블록을 하나로 대체해야 할 수도 있습니다.

Answer 1

사실 그것은 모든 \ n 개의 \ r에 이스케이프 처리 및 U를 \와

document.getElementById("foo").innerHTML = '<pre>' + JSON.parse('"' + htmlString + '"') + '</pre>'; 

Answer 2

에 대한 JSON.parse를 사용할 필요가 없습니다가 <pre></pre> 태그를 올바르게 포맷 할 수 JSON.parse()처럼 보인다 이. 기본적으로 Javascript은 새 라인을 \n으로 간주합니다.

다음 질문을 참조하십시오. 당신이 바이올린 보았다 경우

JavaScript string with new line - but not using \n