如何正確使用innerHTML

Question

我有一個鏈接，當我單擊它時，它會使用字符串參數調用javascript函數。 該字符串實際上是一個a-tag + script-tag，例如：

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

顯示視頻文件。

因此，無論如何，應該使用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？

我不確定它的xslt部分，但想法是將您的兩部分分開（您曾說過這實際上是<a>Anchor</a>和<script>Javascript</script> ）

html

<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很有興趣，但是代碼的怪異外觀和難以理解的代碼告訴我們有些問題。

一種可能的解決方案是注釋方法：渲染列表，其中包含項的關鍵信息作為數據屬性存儲在其上，然后讓javascript代碼（您自己的代碼或客戶端模板引擎）構建輸出。