javascript - 使用 jquery 复制/克隆脚本标签

Question

我有一个 <script>在 <div> 中标记内容元素。现在我需要复制/克隆内容，将其存储在一个变量中并稍后追加。

奇怪的是，当我附加变量内容时，我只得到了外部 <div> .

知道我做错了什么吗？我们正在使用 jQuery 1.8.2。

这是我的代码:

html 内容:

<div id="payl">
    <div class="toolTipHandler">
        <script type="text/javascript">
            var xxx_title = "<h4>title</h4>";
            var xxx_text = "<p>bla bla</p>";
        </script>
    </div>
</div>

script.js 内容:

var toolTipHandler = jQuery('#payl .toolTipHandler').clone(true);
document.getElementById('payl').innerHTML = '';
jQuery('#payl').append(toolTipHandler);

结果:

<div class="toolTipHandler"></div>

Answer 1

根据

https://jquery.com/upgrade-guide/1.9/

在 1.9 之前，任何 HTML 接受方法(例如 $()、.append() 或 .wrap())都会执行 HTML 中的任何脚本并将它们从文档中删除以防止它们再次执行

所以问题是 .append() 正在删除脚本

解决方法可能是只使用纯 html 来“克隆和追加”例如。假设你有另一个 div

<div id='payl2'>....</div>

只复制innerhtml

document.getElementById('payl2').innerHTML=document.getElementById('payl2').innerHTML+document.getElementById('payl').innerHTML;

结果是:

<div id='payl2'>....

<div class="toolTipHandler">
    <script type="text/javascript">
        var xxx_title = "<h4>title</h4>";
        var xxx_text = "<p>bla bla</p>";
    </script>
</div>

</div>