Javascript: esecuzione dell'azione una volta caricata la pagina successiva?

Question

Attualmente sto costruendo un estensione di Google e questo è quello che ho intenzione di:

Fai qualcosa sulla awesome.page1.html quindi premere automaticamente Pagina successiva. Quando la nuova pagina è stata caricata, compila il campo di testo di un modulo.

Il mio problema è che anche se so come compilare il campo di testo, non so come dirlo per riempirlo una volta che la pagina 2 è stata caricata. Si continua a cercare di fare tutto a pagina 1.

Questo è quello che sto cercando, ma non funziona:

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); 
    } 
} 

sto usando un avviso solo per i test, e io continuo a ricevere la "Pagina 2 è attivo "anche se è ancora sulla pagina 1. Sto verificando se un elemento, che è presente solo nella pagina 2, è attivo. Come posso assicurarmi che la pagina2 sia attiva?

Answer 1

Il metodo più semplice con cui ho scelto di andare era corrispondenze di script di contenuto.

Quello che ho fatto è stato creare due file javascript separati nella mia estensione: 1.js e 2.js. Quando carichi awesome.page1.html verrà eseguito 1.js e quando caricherà page2.html verrà eseguito 2.js.

Tutto ciò che ho fatto nel mio manifest.di file JSON è la seguente:

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

Answer 2

Beh, qui il codice:

document.getElementsByClassName("myformTextField imageName") 

restituisce un array vuoto quando trova nulla, che non è undefined. Perciò, la tua prima condizione if sarà sempre vera, indipendentemente dal fatto che trovi il tuo articolo o meno.

Invece, controllare la lunghezza restituito da getElementsByClassName o utilizzare querySelector e verificare la presenza di nulla

if (document.getElementsByClassName("myformTextField imageName").length) { ... } 

// Or.. 
if (document.querySelector('.myformTextField.imageName') !== null) { ... } 

Answer 3

si dovrebbe cercare di utente jquery e la $(document).ready(handler)

questo è davvero una buona pratica per garantire che la pagina viene caricata prima che tenti di eseguire i tuoi comandi http://api.jquery.com/ready/

Answer 4

L'emissione principale In questo caso, le variabili JavaScript, incluse le funzioni, non persistono da una pagina all'altra. In altre parole, non è possibile scrivere una funzione su una pagina e averla eseguita nella pagina che la sostituisce.

È possibile passare una variabile URL o impostare un cookie per la persistenza dei dati o memorizzare le impostazioni sul server, ma un approccio JavaScript semplice non funzionerà.

Ovviamente, c'è un piccolo trucco che alcuni usano per caricare l'intero DOM della pagina successiva in una variabile (usando una variazione su XMLHttpRequest), applicare le impostazioni memorizzate all'oggetto in memoria e quindi sostituire la maggior parte del corpo del documento con la maggior parte del nuovo DOM, ma probabilmente è molto più complicato del necessario e deve essere conforme ai requisiti dello stesso dominio.