Question

我有一个名为“opposite_team_boxscore”的数据库字段，其中包含此javascript小部件：

<script type="text/javascript" src="http://widgets.sports-reference.com/wg.fcgi?css=1&site=br&url=%2Fboxes%2FCHA%2FCHA201506180.shtml&div=div_ChicagoWhiteSoxbatting"></script>

我已将它加载到我的页面上：

$.post(phpPage, {thisDate: dateOfGame}, function(returnedData) {
                var obj = jQuery.parseJSON( returnedData );
                //...some code here
                var str = obj["opposing_team_box_score"];
                var newdiv = document.createElement('div');
                newdiv.innerHTML = str;  
document.getElementById('opposing_boxscore').appendChild(newdiv);
});

代码会在页面上呈现，但它不会运行：

<div id="opposing_boxscore">
                <div><script type="text/javascript" src="http://widgets.sports-reference.com/wg.fcgi?css=1&amp;site=br&amp;url=%2Fboxes%2FCHA%2FCHA201506180.shtml&amp;div=div_ChicagoWhiteSoxbatting"></script></div></div>

我相信这是因为在dom加载到页面后加载了脚本。

一旦脚本在页面上，我该如何让它运行？这在jquery中甚至可能吗？

**********编辑*************************** 我基本上放弃了这种方法。这不是jquery的设置。我寻找并找到了一个可以提供我需要的数据的API。

Answer 1

$(document).ready(function(){
  // do your stuff
});

当DOM准备就绪时，内部代码运行。

Answer 2

如果您需要使用SCRIPT标记运行外部JavaScript，则必须将其插入HEAD标记...

类似这样的事情

var head = document.head;
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'http://widgets.sports-reference.com/wg.fcgi?css=1&site=br&url=%2Fboxes%2FCHA%2FCHA201506180.shtml&div=div_ChicagoWhiteSoxbatting';

head.insertBefore(script,head.firstChild);

好消息是“YES”，你可以使用脚本标签动态加载javascript，坏消息是你试图加载的javascript是使用document.write并且不可能写入文档来自异步加载的外部脚本，除非明确打开它。

Answer 3

注意，＆＃34; http://widgets.sports-reference.com/wg.fcgi?css=1&site=br&url=%2Fboxes%2FCH%E2%80%8C%E2%80%8BA%2FCHA201506180.shtml&div=div_ChicagoWhiteSoxbatting＆＃34;

似乎返回状态代码500 Internal Server Error？

尝试在结束<\/script>时替换转义的结束正斜杠。

$.post("/echo/json/", {
    json: JSON.stringify({
        "opposing_team_box_score": "<script>alert(123)<\/script>"
    })
}, function (returnedData) {
    var str = returnedData["opposing_team_box_score"];
    $("head").append(str);
}, "json");

jsfiddle http://jsfiddle.net/99yk0o8L/1/

＆＃13;

var obj = {
 "opposing_team_box_score":"<script>alert(123)<\/script>"
};

var str = obj["opposing_team_box_score"];
$("head").append(str);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div></div>

＆＃13;

Answer 4

我发现这种方法不起作用。我继续使用API来获取数据，而不是尝试将javascript代码存储在数据库字段中并使其运行。

获取动态加载的脚本，以便在加载dom后运行

4 个答案: