Question

我在一个div中推送包含<script>的HTML代码，我能够成功地使用div innerHTML但脚本未执行。

代码：

$.ajax({
    data: '',
    dataType: 'html',
    ContentType: 'application/json;charset=utf-8',
    type: 'POST',
    url: 'test.ashx',
    success: function(result) {
        $("#div").attr('innerHTML', result));
        var arr = $("#divClaims").find('script'));
        for (var n = 0; n < arr.length; n++)
            eval(arr[n].html());
    }
});

结果如下：

"<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
Code for script....
</script>
<div id=''></div>"

我在这里搜索但无法获得有效的解决方案脚本来自程序，所以我只需要使用它。我尝试了所有其他问题，但没有成功。我用javascript不是很好....

我也试过这个：

function testCode(script1) {
        var script = document.createElement('script');
        script[(script.innerText === undefined ? "textContent" : "innerText")] = script1;
        document.documentElement.appendChild(script);
    }

没有运气!!!

Answer 1

如果要替换html代码，请使用

$("#div").html(result);

Answer 2

动态附加与html元素混合的脚本标记可能比最初想象的更棘手（innerHTML不起作用）

通常，使用

$('#target').html(html)

做得很好。

jQuery明确地从script代码分支中排除link，style和innerHTML：https://github.com/jquery/jquery/blob/2.1.4/src/manipulation.js#L414

// See if we can take a shortcut and just use innerHTML
if ( typeof value === "string" && !rnoInnerhtml.test( value )

where
rnoInnerhtml = /<(?:script|style|link)/i,

您可以查看jQuery如何处理script函数中的domManip个案。见domManip source code

jQuery提取脚本标记，然后通过关于script.src属性的特殊情况对其进行规避。

这个jsFiddle似乎对我有用：https://jsfiddle.net/sqz73pjg/用于执行和内联脚本以及加载外部脚本。

推入DIV后执行脚本

2 个答案: