innerHTML을 올바르게 사용하는 방법

Question

링크를 클릭하면 문자열 인수로 javascript 함수가 호출됩니다. 이 문자열은 실제로 a-tag + script-tag이며 다음과 같습니다.

<a>..</a><script>...</scipt> 

비디오 파일을 표시합니다.

어쨌든 자바 스크립트 함수는 해당 코드를 만들고 페이지에 비디오를 표시하도록되어 있지만 링크를 누르면 표시되는 내용은 코드 문자열이므로 텍스트로 표시됩니다 (그러나 그것의 하이퍼 링크) 및 비디오가되기 위해 실행되지 않습니다.

누구나 알 수 있습니까?

그 이상을, 내가 (텍스트로 표시) 코드를 복사, 정상 등의 편집기에 붙여 경우, 다음 동영상 보여주기 때문에 ...

<a title="Click to Show Video" href='javascript:void(0);' onclick="switchFunc('{$thisNode/@*[name()=current()/@Name]}');"> 
    <div dir="{@Direction}" class="ms-rtestate-field"> 
     <xsl:value-of select="$thisNode/@*[name()=current()/@Name]" disable-output-escaping="yes"/> 
    </div> 
</a> 




<script type="text/javascript"> 
    function switchFunc(source) { 
    document.getElementById('videoContainer').innerHTML = source; 
    } 
</script> 

<div id="videoContainer"> </div> 

Answer 1

난 당신이 다음을 시도 할 수 귀하의 속성이 인코딩되고 있다는 것을 나는 의심 코멘트에 말했듯이 :

<a title="Click to Show Video" href='javascript:void(0);' > 
<xsl:attribute name="onclick">switchFunc('<xsl:value-of select="$thisNode/@*[name()=current()/@Name]" disable-output-escaping="yes"/>');</xsl:attribute> 
    <div dir="{@Direction}" class="ms-rtestate-field"> 
     <xsl:value-of select="$thisNode/@*[name()=current()/@Name]" disable-output-escaping="yes"/> 
    </div> 
</a> 

Answer 2

왜 해달라고 당신이 업데이트 innerHTML을 가진 원하는 태그, 그리고 자바 스크립트를 eval을 통해 실행 시키면 되겠습니까?

나는 그것의 XSLT 부분에 대해 완전히 잘 모르겠지만, 생각이 두 부분을 파괴하는 것입니다

HTML (당신이 정말 <a>Anchor</a> 및 <script>Javascript</script>입니다 말했다)

<a title="Click to Show Video" 
    href='javascript:void(0);' 
    onclick="switchFunc('<a>Anchor</a>','Javascript');"> 

JS

<script type="text/javascript"> 
    function switchFunc(htmlValue, javascriptMethodCall) { 
    document.getElementById('videoContainer').innerHTML = htmlValue; 
    eval(javascriptMethodCall); 
    } 
</script> 

Answer 3

속성 값은 출력 이스케이프 설정에 관계없이 항상 이스케이프 처리됩니다. 즉, 콘텐츠가 XML 파일의 형식을 손상시킬 수있는 다른 방법입니다.

어쨌든 핵심 아키텍처는 여러 가지면에서 문제가됩니다. 먼저 사소한 클라이언트 측 기능을 서버로 이동합니다. 게다가이 방법으로 페이지의 주요 내용 (비디오 URL)을 스크립트 코드에 캡슐화하여 인덱서에서 숨길 수 있습니다.

나는 XSLT를 아주 재미있게 보였지만 이상한 표정과 코드의 가독성으로 무언가가 좋지 않다는 것을 알 수있다.

가능한 해결책은 주석 접근법입니다. 주요 정보가 데이터 속성으로 저장된 항목으로 목록을 렌더링하고 자바 스크립트 코드 (사용자 또는 클라이언트 측 템플릿 엔진)가 출력을 작성하게합니다.