Question

<!DOCTYPE HTML>
<html>
<head>
   <script src="js/jquery-1.10.2.min.js"></script>
   <script>
    $(document).ready(function() { 

           var x="<script>alert('hello world');</script>";

           $("#div_one").html(x);

    });
    </script>
  </head>
  <body>
     <div id="div_one">
     </div>
  </body>
</html>

为什么这不起作用？我希望解释脚本标记之间的JS代码并查看警告消息......

我想做什么：

我编写了一组函数，根据用户输入（JavaScript）添加和删除数组中的项。然后，我有一个函数，它绘制（）数组中保存的项目的ul列表。在每个项目的后面，我想提供一个删除链接，它调用一个JavaScript函数，从数组中删除项目，然后调用drawList（）重绘列表。

如果没有那个安全策略，我只需按照上面显示的代码执行。

Answer 1

我相信这是一些奇怪的浏览器错误。出于某种原因，您不能在脚本块中包含</script>。

更改为

var x="<scr"+"ipt>alert('hello world');</scr"+"ipt>";

Example on jsFiddle

Answer 2

这不是一个错误。问题出在这里：

<script>
$(document).ready(function() { 

       var x="<script>alert('hello world');</script>";

       $("#div_one").html(x);

});
</script>

浏览器认为第一个<script>标记与代码中的</script>相关联。

enter image description here

如您所见，代码显示在DOM中而不是执行。

要进一步证明这一点，请参阅此示例： http://jsfiddle.net/DerekL/Ah8Qz/

var x = $("<script>").html("alert('hello world');");
$("#div_one").append(x);

如果您避开</script>结束标记，那么就没有问题，因为HTML解析器会忽略<script>中的任何打开的<script>标记。

总而言之，

浏览器没有安全措施来阻止脚本被注入您的页面。
这不是一个接近浏览器错误的地方。

使用jQuery.html（）添加JavaScript代码

2 个答案: