2

我正面临一个关键问题。我有一个包含两个部分的页面。在页面的第一部分，通过 ajax 请求呈现 html。在第二页上，html 在页面加载时呈现。页面的第一部分是单独处理的，具有不同的分页脚本。分页也是通过向同一个 url 发送 ajax 请求来处理的。

我对第一部分有疑问。为第一部分生成 html 的脚本也在使用 javascript 生成大量 javascript 标签和 html。现在，在该 html 中插入新的脚本标记时我正在做的事情是这样的：

var script   = document.createElement("script");
script.type  = "text/javascript";
script.text  = "window.twttr = (function (d,s,id) {var t, js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;js.src=\"//platform.twitter.com/widgets.js\"; fjs.parentNode.insertBefore(js, fjs);return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });}(document, \"script\", \"twitter-wjs\"));(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return;js = d.createElement(s); js.id = id; js.src = \"//connect.facebook.net/en_GB/all.js#xfbml=1\"; fjs.parentNode.insertBefore(js, fjs);}(document, \"script\", \"facebook-jssdk\"));var script_generated=1";               // use this for inline script
document.body.appendChild(script);

实际上是 Twitter 和 Facebook connect 语句在页面第一部分的每个项目上显示一个 Facebook 喜欢按钮和一个 Twitter 按钮。页面第一次加载时，脚本标签生成成功。但是，当我单击分页时，它会发送一个新的 ajax 请求以获取新页面的 html，它还会再次生成相同的脚本标记。所以在第二页上我的 Twitter 按钮和 Facebook like 按钮没有显示出来。

我认为这是由于 Facebook 和 Twitter 的双重连接声明。然后我生成一个变量并在生成该脚本标记时设置一些值。并且在每个请求中，我都会检查该变量是否存在。如果它存在，我不会像这样生成特定的脚本标签：

if(typeof script_generated === "undefined") {
  var script   = document.createElement("script");
  script.type  = "text/javascript";
  script.text  = "window.twttr = (function (d,s,id) {var t, js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;js.src=\"//platform.twitter.com/widgets.js\"; fjs.parentNode.insertBefore(js, fjs);return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });}(document, \"script\", \"twitter-wjs\"));(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return;js = d.createElement(s); js.id = id; js.src = \"//connect.facebook.net/en_GB/all.js#xfbml=1\"; fjs.parentNode.insertBefore(js, fjs);}(document, \"script\", \"facebook-jssdk\"));var script_generated=1";
           // use this for inline script
  document.body.appendChild(script);
}

执行此脚本标记不会重新生成，但推文和 Facebook 之类的按钮仍然不会出现。

现在我已经解释（我可能错了），因为脚本标签是由 ajax 请求生成的，所以按钮没有正确显示，因为它们没有找到它们的脚本标签。

现在我想要的是，每当向该文件发送请求时，它首先检查该特定脚本标签是否存在，如果存在则删除它并生成一个新标签，否则生成。请指导我如何做到这一点。

如果我对问题的解释有误，那么请让我知道确切的问题是什么以及如何克服这个问题。

4

2 回答 2

4

好吧，当您动态添加时，您可以为脚本标签提供 id。

var script   = document.createElement("script");
script.setAttribute('id', 'addedScript');
script.type  = "text/javascript";
script.text  = "window.twttr = (function (d,s,id) {var t, js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;js.src=\"//platform.twitter.com/widgets.js\"; fjs.parentNode.insertBefore(js, fjs);return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });}(document, \"script\", \"twitter-wjs\"));(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return;js = d.createElement(s); js.id = id; js.src = \"//connect.facebook.net/en_GB/all.js#xfbml=1\"; fjs.parentNode.insertBefore(js, fjs);}(document, \"script\", \"facebook-jssdk\"));var script_generated=1";
// use this for inline script
document.body.appendChild(script);

之后，您可以使用它检查脚本标签是否存在，并使用 .remove() 查询函数删除。

if(addedScript != undefined) {
  $("#addedScript").remove();
}
于 2012-05-22T10:36:18.720 回答
0

您好，您可以获得该脚本标签的引用对象，您可以使用 object.src 更改引用的 src 文件。

应该是这样的

var $jsRef = $('<script type="text/javascript" >').appendTo(document.body);
$jsRef.attr("src","jsFileName.js");

// You can also add content like this
$jsRef.append(content);


// You can change the js file name or content the same way
$jsRef.attr("src","newJSFileName.js");

// Changing the content like this
$jsRef.empty();
$jsRef.append(content);

或者，您可以为脚本标签设置 id 并根据 id 更改内容，而不是使用对象访问。

于 2012-05-22T10:35:22.213 回答