javascript 页面重新加载后运行 JS
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/32726338/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Run JS after page reload
提问by Daniel Alexander Benesch
Can I run javascript Code after reloading the page?
我可以在重新加载页面后运行 javascript 代码吗?
In my case I want to enter the code in the address bar via javascript: <<CODE>>
在我的情况下,我想通过在地址栏中输入代码 javascript: <<CODE>>
to reload a page several times and check if a button with a special id exists and to click it. Here is my Code:
多次重新加载页面并检查是否存在具有特殊 id 的按钮并单击它。这是我的代码:
function check () {
if(new Date().getTime >= 1442949420000) {
var loginbtn = document.getElementById('loginbutton');
if(loginbtn){
loginbtn.click();
} else {
console.log('button not yet here - reload');
window.location.reload();
check();
};
} else {
console.log('to early - reload');
window.location.reload();
check();
};
};
check();
The problem is, that the page reloads after window.location.reload()
and the check()
function never gets called, so the page just reloads once.
问题是,页面重新加载之后window.location.reload()
,该check()
函数永远不会被调用,所以页面只重新加载一次。
Or is there a service, that injects my script to a url?
或者是否有服务将我的脚本注入到 url 中?
回答by IanGabes
You can add a URL fragment to the address bar, and then reload the page. So, before the reload, your would be at http://yoursite.com/yourPage
and after the reload, you could be at http://yoursite.com/yourPage#reload
. Here is a simple working example for something along those lines:
您可以将 URL 片段添加到地址栏,然后重新加载页面。因此,在重新加载之前,您会在 ,http://yoursite.com/yourPage
而在重新加载之后,您可能会在http://yoursite.com/yourPage#reload
. 这是一个简单的工作示例,适用于这些方面:
document.getElementById("clickMe").onclick = function clicked(){
window.location.hash = 'reload';
window.location.reload();
}
//When the document has loaded, call the function
document.addEventListener("DOMContentLoaded", function(event) {
if(window.location.hash == "#reload"){
console.log("The Page has been reloaded!");
}else{
console.log("The page has a new hit!");
}
});
<button id="clickMe" type='button'>click</button>
When you click the button, the hash is added to the window location, and then the page is reloaded, with the URL fragment attached. I then decide in the document ready function if the page has been reloaded or not. Make sure to test it locally.
当您单击该按钮时,哈希值被添加到窗口位置,然后页面被重新加载,并附加了 URL 片段。然后我在文档准备功能中决定页面是否已重新加载。确保在本地测试它。
回答by Filip Shulevski
Another approach if you want to run your code from browser console can be:
如果您想从浏览器控制台运行代码,另一种方法是:
- Open developer tools on the page that you want to test PageA
- Then open the same page in a popup window using javascript executed in browser console on PageA (it must be the same page to avoid cross origin errors)
- Save the popup reference in a javascript variable
- Now you can do whatever you want with the page in the popup window even if it reloads
- 在要测试 PageA 的页面上打开开发人员工具
- 然后使用在 PageA 上的浏览器控制台中执行的 javascript 在弹出窗口中打开同一页面(它必须是同一页面以避免跨源错误)
- 将弹出引用保存在 javascript 变量中
- 现在你可以对弹出窗口中的页面做任何你想做的事情,即使它重新加载
EXAMPLE:
例子:
function check() {
var newwindow = window.open('https://yoursite.com', 'WindowTitle', 'height=200,width=150');
if (new Date().getTime >= 1442949420000) {
var loginbtn = newwindow.document.getElementById('loginbutton');
if (loginbtn) {
loginbtn.click();
} else {
console.log('button not yet here - reload');
newwindow.location.reload();
check();
};
} else {
console.log('to early - reload');
newwindow.location.reload();
check();
};
};
check();