[英]Chrome extension- How to have your main script run every time a page loads
So my main content script runs when i refresh the page however when I click on a new page of the webpage it doesnt run again; 因此,我的主要内容脚本在刷新页面时运行,但是当我单击网页的新页面时,它不会再次运行; only once when I refresh the page.
刷新页面时只有一次。 I want it to rerun every time the page changes or when the url changes.
我希望每次页面更改或URL更改时都重新运行。 The main function in the main content script is called "runExtension()"
主要内容脚本中的主要功能称为“ runExtension()”
This is my background.js 这是我的background.js
chrome.tabs.onUpdated.addListener( function (tabId, changeInfo, tab) { if (changeInfo.status == 'complete') { alert("LOADED"); setTimeout(runExtension, 1000); } })
And this is my manifest.json 这是我的manifest.json
{ "manifest_version": 2, "name": "RateMyBull", "description": "View professor ratings from RateMyProfessor when signing up for classes on the USF schedule planner", "version": "1.0", "permissions": ["https://usf.collegescheduler.com/*"], "background": { "scripts": ["background.js"] }, "content_scripts": [ { "matches": ["https://usf.collegescheduler.com/*"], "js": ["RateMyBull.js", "jquery-3.3.1.min.js", "jquery-3.3.1.js"], "run_at": "document_idle", } ] }
setTimeout(runExtension, 1000); function runExtension(){ var tableElementNode = document.querySelectorAll(".section-detail-grid.table-bordered-wrap>tbody>tr>td>div"); console.log(tableElementNode); for (var i = 0; i < tableElementNode.length; i++) { if(tableElementNode[i].children.length < 1 && tableElementNode[i].innerText != "Not Assigned") { tableElementNode[i].className = "professor"; } } var professorsArray = []; var professorElementNode = document.querySelectorAll(".professor"); for (var i = 0; i < professorElementNode.length; i++) { professorElementNode[i].id = i; var professorName = professorElementNode[i].innerText; professorName = professorName.trim(); professorName = professorName.replace(/,/g, ""); professorName = professorName.split([' ']); var firstName = professorName[1]; var lastName = professorName[0]; var professorObj = { first: firstName, last: lastName, ID: i }; professorsArray[i] = professorObj; console.log(professorsArray[i].first); } alert("this just ran"); } chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) { if (msg === 'url-update') { alert("TEST"); } });
Content scripts
like RateMyBull.js
run in a totally separate environment from the background page (on, but somewhat isolated from , a webpage). 诸如
RateMyBull.js
类的Content scripts
在与后台页面(在某个网页上, 但与该网页有些隔离 )的完全独立的环境中运行。
If you want your background page to cause code in a content script to run, use message passing . 如果您希望背景页面导致内容脚本中的代码运行,请使用消息传递 。
In your case, try changing background.js
to: 就您而言,尝试将
background.js
更改为:
chrome.tabs.onUpdated.addListener( function (tabId, changeInfo, tab) {
if (changeInfo.status == 'complete') {
chrome.tabs.sendMessage(tab.id, {type: "runExtension"});
}
})
And adding a listener to your RateMyBull.js
content script: 并将侦听器添加到您的
RateMyBull.js
内容脚本中:
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
if (request.type === "runExtension")
runExtension();
});
Of course, there are lots of ways a webpage can "change". 当然,网页可以通过多种方式“更改”。 See the question and associated answers wOxxOm referenced in the comments for more insight on detecting various types of changes.
请参阅注释中引用的问题和相关答案,以获取有关检测各种类型更改的更多信息。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.