2012-11-04 2 views
2

가정하자 내가 가진이 같은 문자열 :어떻게 태그 자체를 교체하지 않고 html 태그 사이의 내용을 대체하는

내가 인코딩을 html로 콜백 함수와 <code> 태그 사이의 모든 발행 수를 대체하는 자바 스크립트를 사용할
<code>Blah blah Blah 
enter code here</code> 
<code class="lol">enter code here 
fghfgh</code> 

그것.

function code_parsing(data){ 
    //Dont escape & because we need that... in case we deliberately write them in 
    var escape_html = function(data, p1, p2, p3, p4) { 
     return p1.replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;"); 
    }; 

    data = data.replace(/<code[^>]*>([\s\S]*?)<\/code>/gm, escape_html); 
     // \[start\](.*?)\[end\] 
     return data;   
    }; 

이 기능은 불행하게도 "<code>" 태그를 제거하고 바로 내용으로 교체된다

이 내가 현재 가지고있는 것입니다. 많은 수의 속성으로 <code> 태그를 유지하고 싶습니다. <code> 태그를 다시 하드 코딩하면 속성을 잃게됩니다.

정규식이 인데 가장 좋은 도구는 아니지만 중첩 된 요소는 없을 것입니다.

+1

"...하지만 중첩 된 요소는 없습니다." 중첩 된 주석, 속성 값의 꺾쇠 괄호, 태그 이름의 비표준 사례 등은 무엇입니까? HTML 문법은 크고 규칙적이지 않습니다. –

+0

사실 더 나은 방법이 앞으로 필요할 것입니다. 실제 HTML 파서에 대한 제안 사항이 있습니까? – CMCDragonkai

+0

JS에서 뻔뻔한 플러그가 마음에 들지 않는다면 http://code.google.com/p/google-caja/wiki/JsHtmlSanitizer –

답변

3

정규식을 사용하여 HTML을 구문 분석하지 마십시오.

즉, 괄호 그룹을 사용하여 보존하려는 컨텐트를 캡처하고 사용자가 조작 한 비트에 대용 물을 추가해야합니다. 당신의 escape_html 함수에서 작업이 문자열에서 수행 한 후 :

data.replace(/(<code[^>]*>)([\s\S]*?)(<\/code>)/g, 
      function (_, startTag, body, endTag) { 
       return startTag + escapeHtml(body) + endTag; 
      }) 

는 HTML을 구문 분석하는 정규 표현식을 사용하지 말아야하는 이유, 이해이

<code title="Shows how to tell whether x > y">if (x &gt; y) { ... }</code> 

<code lang="js">node.style.color = "<code lang="css">#ff0000</code>"</code> 

<code>foo</CODE > 

<textarea><code>My HTML code goes here</code></textarea> 

<code>foo <!-- commented out </code> --></code> 
+0

이것이 효과적입니다. 감사. BTW, 나는 낙타를 사용하지 않았다. 그것은 escape_html입니다. – CMCDragonkai

+0

@ user582917 죄송합니다. 그냥 습관. –

1

간단한 솔루션으로 무엇을 고려해야 할 하지만 그것을 반환하기 전에, 문자열에 태그를 붙이고 앞에 붙이고 모든 것을 반환하십시오.

때때로 가장 간단한 대답은 다음과 같습니다.

관련 문제