Javascript:下一页加载后执行操作？

Question

我目前正在构建一个谷歌扩展,这就是我想要的:

在awesome.page1.html上做一些事情,然后自动按下一页.加载新页面后,填写表单的文本字段.

我的问题是,即使我知道如何填写文本字段,我也不知道如何在page2加载后告诉它填写它.它一直试图在第1页上做所有事情.

这是我正在尝试但它不起作用:

function addEffect() {
  document.getElementsByClassName("effect1 shine")[0].click();
  document.getElementsByClassName("nextPage BigButton")[0].click();
  nextStep();
}

function nextStep() {
  if(document.getElementsByClassName("myformTextField imageName") != undefined) { 
         alert('Page 2 is up.');
  } 

  else {
         alert('Page 1 is still up.');
         setTimeout("nextStep()", 250);
  }
}

我正在使用一个仅用于测试的警报,即使它仍然在第1页上,我仍然继续获得"Page 2已启动".我正在检查是否仅存在于第2页的元素是否已启动.我怎么能确定page2已启动？

Answer 1

您将要遇到的主要问题是JavaScript变量-包括函数-不会从一页到另一页持续存在。换句话说，您不能在一个页面上编写函数，而不能在替换它的页面上执行该函数。

您可以传递一个URL变量或为数据持久性设置一个cookie（或在服务器上存储设置），但是直接的JavaScript方法不起作用。

当然，有些人可以使用一些技巧来将下一页的整个DOM加载到变量中（使用XMLHttpRequest的变体），将存储的设置应用于内存中的对象，然后替换大部分文档带有大多数新DOM的主体，但这可能比您需要的要复杂得多，并且必须符合同域要求。

Answer 2

我选择使用的最简单的方法是内容脚本匹配。

我所做的是在我的扩展中创建两个单独的 javascript 文件：1.js 和 2.js。当awesome.page1.html加载时，它将运行1.js，当page2.html加载时，它将运行2.js。

我在 manifest.json 文件中所做的所有操作如下：

"content_scripts":[
        {"matches": ["http://awesome.page1.com/*"], "js": ["1.js"]},
        {"matches": ["http://page2.com/*"], "js": ["2.js"]}]