html 특수 엔터티를 해석하는 브라우저없이 입력 값을 검색하는 방법은 무엇입니까?

HTML 요소를 해석하지 않고 입력 요소에서 값의 실제 텍스트를 검색하는 JavaScript 또는 MooTools의 방법이 있습니까? 아래의 예제를 참조하십시오. 내가/입력 텍스트 입력 상자에 직접 <script>alert('scrubbed');</script>를 복사 할 경우 작동html 특수 엔터티를 해석하는 브라우저없이 입력 값을 검색하는 방법은 무엇입니까?

<div id="output"> 
    <p>Your text is: <b>[&lt;script&gt;alert('scrubbed');&lt;/script&gt;]</b></p> 
</div>

하는 것으로,하지만 난 페이지를로드 한 후 바로 삽입하면 실패 : 내 원하는 결과입니다.

<html> 
<head> 
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
    <title>scrubtest</title> 
</head> 
<body id="scrubtest" onload=""> 
    <script type="text/javascript" language="JavaScript" src="/js/mootools-core.js"></script> 

    <input type="text" name="scrubtext" value="&lt;script&gt;alert('scrubbed');&lt;/script&gt;" id="scrubtext"/><br /> 
    <input type="button" value="Insert" onclick="insertText();"/><br /> 

    <input type="button" value="Get via MooTools" onclick="alert($('scrubtext').get('value'));"/><br /> 
    <input type="button" value="Get via JavaScript" onclick="alert(document.getElementById('scrubtext').value);"/><br /> 

    <div id="output"> 
    </div> 

    <script type="text/javascript" charset="utf-8"> 
     function insertText() 
     { 
      var stext = $('scrubtext').get('value'); 
      var result = new Element('p', {html: "Your text is: <b>["+stext+"]</b>"}); 
      result.inject($('output')); 
     } 
    </script> 

</body> 
</html>

출처

2010-04-20 CaptainQwyx

탈출이 같은 & : &

<input type="text" name="scrubtext" value="&amp;lt;script&amp;gt;alert('scrubbed');&amp;lt;/script&amp;gt;" id="scrubtext"/>

문제의

출처

2010-04-20 21:02:26

그래도 효과가 있지만 이미 한 번 살균 된 텍스트를 "살균"해야한다고 생각하지 않습니다. 입력 값은 서버 측 (PHP) 유효성 검사 결과입니다 : $ destination [ 'transit_time'] = trim (htmlspecialchars ($ destination [ 'transit_time'])) ENT_QUOTES)); 문서 주위로 옮길 때 위생적으로 유지하고 싶습니다. – CaptainQwyx

위생 처리하지 않았습니다. 당신은 HTML을 이스케이프 처리합니다. '&'는 HTML로 표시되도록 이스케이프해야합니다 (브라우저는 HTML 인코딩을하지 않더라도 용서하고 표시 할 수 있습니다). 그것의 규칙. 이것을 따라 가라. –

하지만 그건 정확히 당신이 원하는 것입니다. '(input) = "<">'을 쓰면 (simpified), 입력 값은 **'''이됩니다. 값을'< '으로하고 싶다면'& lt;'로 이스케이프해야합니다. 그것이 단순히 작동하는 방법이며, 그것에 대해 잘못된 것은 없습니다. – RoToRa

{html: "Your text is: <b>["+stext+"]</b>"}

: 당신이 일반 텍스트 문자열을 복용하고 HTML 마크 업으로 추가하고 있습니다. 당연히 텍스트 문자열에있는 < 문자는 마크 업이 될 것이므로 잠재적 인 클라이언트 측 사이트 간 스크립팅 취약점이 발생할 수 있습니다.

당신은 탈출을 HTML 수 있지만, 스스로를 정의하는 예를 그래서 JS에서 그것을 할 수없는 내장 기능 : 그러나

// HTML-encode a string for use in text content or an attribute value delimited by 
// double-quotes 
// 
function HTMLEncode(s) { 
    return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/"/g, '&quot;'); 
} 

... 

var result = new Element('p', {html: "Your text is: <b>["+HTMLEncode(stext)+"]</b>"});

없다, DOM을 사용하는 것이 일반적으로 간단합니다 문자열 해킹을하지 않고 일반 텍스트를 추가하는 방법. 나는 무 이렇게 그것을 할 것입니다 생각 :

var bold= new Element('b', {text: stext}); 
var result= new Element('p', {text: 'Your text is: '}); 
bold.inject(result);

출처

2010-04-20 21:16:48 bobince

당신은

var result = new Element('p', {html: "Your text is: <b>["+stext.replace(/&/g,'&amp')+"]</b>"});

추가를 사용하여 &amp에 & 문자를 변경할 수 있습니다 : 나는 DOM 노드의 속성을 사용의 이익을 bobince와 함께 갈 것입니다, 임의의 HTML을 삽입하는 대신

출처

2010-04-20 21:17:14 MasterAM

-1

function htmlspecialchars_decode(text) 
{ 
var stub_object = new Element('span',{ 'html':text }); 
var ret_val = stub_object.get('text'); 
delete stub_object; 
return ret_val; 
}

출처

2013-09-06 01:22:38 user2752712

delete '는 변수 이름으로 작동하지 않지만 객체의 속성으로 작동합니다 (http://stackoverflow.com/questions/7009115/behavior-of-delete-operator-in-javascript). –

html 특수 엔터티를 해석하는 브라우저없이 입력 값을 검색하는 방법은 무엇입니까?

답변

관련 문제