innerHTMLを正しく使用する方法

Question

リンクをクリックすると、文字列引数を使用してjavascript関数が呼び出されます。ビデオファイルを表示する

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

：この文字列は次のように、実際にはA-タグ+スクリプトタグです。

とにかく、javascript関数はそのコードを作成してビデオをページに表示することになっていますが、リンクを押すと表示されるのはコードの文字列なので、テキストとして表示されますそれはハイパーリンクです）、ビデオになるために実行していません。

誰でも知っていますか？

その奇妙に、私は（テキストとして表示される）コードをコピーして、通常のように、エディタに貼り付けた場合、そのビデオは示しているので...

<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経由でjavascriptを実行させるのですか？

HTML

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

（あなたはこれが本当に <a>Anchor</a>と <script>Javascript</script>で言っていた）私はそれのXSLTの一部について全くわからないが、アイデアは、あなたの二つのセクションを分割することです

JS

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

Answer 3

属性値は、出力がエスケープ設定に関係なく常にエスケープされます。これは、コンテンツがXMLファイルの正常性を破壊する可能性があります。

とにかく、コアアーキテクチャは複数の点で問題があります。まず、簡単なクライアント側の機能をサーバーに移します。さらに、ページのメインコンテンツ（ビデオURL）をスクリプトコードにカプセル化して、インデクサーから隠すこともできます。

私はXSLTの大きな楽しみですが、コードの変わった見た目と読みにくいことは、何かがOKではないことを示しています。

主な情報をデータ属性として保持しているアイテムを持つリストをレンダリングし、javascriptコード（独自またはクライアント側のテンプレートエンジン）で出力を作成させるというアプローチが考えられます。