在分离的元素中加载页面并在不影响当前文档的情况下自行执行其脚本

时间:2019-05-10 01:02:55

标签: javascript jquery html

当用户单击链接时,我目前正在尝试执行以下操作:

  1. 点击被捕获,该URL而不是导航到URL,而是被加载到jQuery对象中。

  2. 我在jQuery对象中使用了<article>元素。

  3. 我将当前文档中的<article>元素替换为jQuery对象中的元素。

这工作正常,除了不执行我在jQuery对象中加载的页面中的脚本。这些脚本必须运行才能使其内容完整并正常工作。

通常,我将在替换<article>元素之后使用jQuery的getScript函数加载脚本,除了这会对<article>元素之外的页面中的所有内容产生一些不良影响,因为脚本不应执行两次。

我正在使用一个非常有限的框架,该框架并不真正适合于Web开发,因此我坚持使用它。它生成一个巨大的最小化的单个模块。我不能简单地分隔或编辑脚本以使它们完全按照我的需要执行,而其功能似乎都不能完全按照我的需要执行。

function loadArticle(targetURL)
{
  var newPage = $("<div />");
  newPage.load(targetURL, function (response, status, xhr) {
    if (status != "error")
    {
      newPageScripts = $('<script src="path/to/framework/script.js"></script>');
      newPageArticle = newPage.find("article");

      $("article").replaceWith(newPageArticle);
      $("article").append(newPageScripts);
      window.history.pushState("","",targetURL);  
    } 
  });
}

我想知道是否可以,

  1. 将页面加载到一个对象中,强制其自己执行其脚本,然后将文档中的<article>元素替换为其结果的<article>元素。

    < / li>
  2. 将页面加载到一个对象中,将文档中的<article>元素替换为其<article>元素,然后运行其脚本,其方式仅会影响{{ 1}}元素,就好像它仅限于其作用域或沙盒一样。

0 个答案:

没有答案