javascript - 使用 jquery 将 &lt;script&gt; 附加到 <div> 中

Question

我正在尝试附加 <script>标记到我的 <div> 。每当我尝试这样做时，脚本就不会加载。但如果我将其硬编码在标签下，它就会起作用。

但是如果我尝试附加 <img>标签，它有效!

这里是部分代码，可以为您提供一些想法。

$(document).ready(function() {
    var tag = '<script src="xxx.js"></script>'; // file to grab images
    var tag2 = '<img src="some image link"></img>';
    $('#test').append(tag); //testing
    $('#test2').append(tag2); //testing
});

在 HTML 上

<div id="test"></div> <!-- Not Working! -->
<div id="test2"></div> <!-- This Works! -->

<div id="test"><script src="xxx.js file to grab images"></script></div> <!-- This Works too! -->

编辑以下更多信息:

我实际上已经在网上寻找解决方案，大多数答案与此处给出的答案几乎相同。就我而言，它与其他人略有不同。这是因为标签变量实际上是数据库中必须的。

<?
$result = mysql_query("SELECT code FROM users_loc WHERE method='script'") or die(mysql_error());
$row = mysql_fetch_array($result);
?>

在 JavaScript 方面:

    $(document).ready(function() {
        var tag = <? echo $row['code'] ?>;
        var tag2 = <? echo $row2['code'] ?>;
        $('#test').append(tag); //testing
        $('#test2').append(tag2); //testing
    });

在我的网站上，用户将他们的外部图像源输入到我的数据库中，我将抓取源并将其显示在我的网站上。但是当用户输入 <script> 时，问题就出现了。如果将其硬编码到 <div> 中，则该标签可以工作

我的控制台上一直显示此错误消息“异步加载的外部脚本对 document.write() 的调用被忽略。”

我希望这能解答大家的困惑。谢谢。

编辑:我认为这是附加的问题:Does Jquery append() behave asynchronously?

Answer 1

这都是因为解析问题。找到</script>后出现的问题这段代码。假设我们想要关闭脚本标签，但我们不会。为了避免这种情况，输入 \之前/像这样转义特殊字符:

$(document).ready(function() {
  var tag = '<script src="xxx.js"><\/script>'; // file to grab images
  var tag2 = '<img src="some image link"></img>';
  $('#test').append(tag); //testing
  $('#test2').append(tag2); //testing
});

<强> DEMO

尝试检查 chrome 中的元素以查看代码。