2

对于一个项目，我正在动态加载由 html 和 javascript 组成的内容。到目前为止，我使用的是 jquery 1.8.3，但在清理时我想更新到 1.10.1。我已将问题缩小到我在内容 div 上使用 $.html() 函数的方式。

在 jquery 1.8.3 中：

var content = $("#content");
contentDiv.html("<script> alert('Testing'); </script>")

显示一个带有“测试”内容的警报框，而在较新的 jquery 版本中，相同的代码将字符串插入到 DOM 中，然后警报框也会出现。我希望不显示标签。

上下文 javascript：

 this.loadPage = function(page, callback){
    $.get(page.ViewFile, function(view){
        var content = $("#content");
        $("#content").html(view);
}};

正在加载的页面包含，它作为字符串存储在变量视图中。

<h1>New Content</h1>
<div id="newContent"></div>
<script>
function View(){
    this.InitializeView = function(model){
        //code
    }

    this.UpdateView = function (model){
        //code
    }
 }
 </script>
4

1 回答 1

1

当我们将代码放入页面时，似乎浏览器检测到字符串内部的</script>（脚本标记的结尾）作为真正的结束。head

在此处输入图像描述

这就是网页中抛出错误的原因（EXAMPLE）：

Uncaught SyntaxError: Unexpected token ILLEGAL fiddle.jshell.net/:22

我想您必须将您的 javascript 代码移动到一个单独的文件main.js中，例如 .

在本地对其进行了测试，并且可以正常工作：

HTML

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.10.1.js"></script>
        <script src="main.js"></script>
        <script type="text/javascript">
            setTimeout(function () {
                $("body").text("Testing now from HTML: using <script>");
                setTimeout(function () {
                     $("body").html("<script>alert('This alert will fail.')</script>");
                }, 1000);
            }, 2000);
        </script>
    </head>
    <body></body>
</html>

Javascript (main.js)

$(document).ready(function () {
    $("body").html("<h1>Wait one second.</h1>");
    setTimeout(function () {
        $("body").html("<script>alert('Tested')</script>");
    }, 1000);
});

甚至文本编辑器也将其检测为结束标记：

在此处输入图像描述

解决方案

1.从jQuery创建脚本

var content = $("#content");

var script = $("<script>");
script.html("alert('Testing');");

content.append(script)

1.使用&

基本上，您必须替换为 <、&lt和>，&gt如本答案中所述：&&amp

var tagsToReplace = {
    '&': '&amp;',
    '<': '&lt;',
    '>': '&gt;'
};

function replaceTag(tag) {
    return tagsToReplace[tag] || tag;
}

function safe_tags_replace(str) {
    return str.replace(/[&<>]/g, replaceTag);
}

有关详细信息，请参阅此问题。

于 2013-07-02T07:50:43.250 回答