C'est déclenché lorsqu'un onglet est mis à jour.
Lorsque l'utilisateur navigue vers une nouvelle URL dans un onglet, cela génère généralement plusieurs événements onUpdated
au fur et à mesure que diverses propriétés de l'objet tabs.Tab
sont mises à jour. Ceci inclut l' url
, mais aussi potentiellement le title
et les propriétés favIconUrl
. La propriété du status
passe par le "loading"
et "complete"
.
Cet événement sera également déclenché pour les modifications des propriétés d'un onglet qui n'impliquent pas de navigation, comme le pinning et le débrochage (qui met à jour la propriété pinned
) et le muting ou le unmuting (qui met à jour les propriétés audible
et mutedInfo
).
Vous pouvez filtrer cet événement, en le rendant uniquement valable pour les onglets dont les urls correspondent à des patterns spécifiques, ou pour les modifications de propriétés spécifiques, ou pour les modifications d'un onglet ou d'une fenêtre spécifique, ou toute combinaison de ces restrictions.
Syntaxe
browser.tabs.onUpdated.addListener(listener[, extraParameters])
browser.tabs.onUpdated.removeListener(listener)
browser.tabs.onUpdated.hasListener(listener)
Les événements ont trois fonctions :
addListener(callback[, extraParameters])
- Ajoute un écouteur à cet événement
removeListener(listener)
- Arrêtez d'écouter cet événement. L'argument
listener
est l'écouteur à supprimer. hasListener(listener)
- Vérifiez si
listener
est enregistré pour cet événement. Renvoietrue
s'il écoute, sinonfalse
.
Syntaxe addListener
Paramètres
callback
-
Fonction qui sera appelée lorsque cet événement se produira. La fonction sera passée les arguments suivants :
tabId
integer
. ID de l'onglet qui a été mis à jour.changeInfo
object
. ontient les propriétés des propriétés de l'onglet qui ont été modifiées. VoirchangeInfo
ci-dessous.tab
tabs.Tab
. Le nouvel état de l'onglet.
extraParameters
Facultatif-
object
. Un ensemble de filtres qui restreint les événements qui seront envoyés à cet auditeur. C'est un objet qui peut avoir une ou plusieurs des propriétés suivantes. Les événements ne seront envoyés que s'ils satisfont à tous les filtres donnés.urls
Array
. Un tableau match patterns. Ne déclenchez l'événement que pour les onglets dont la propriété de l'url
courante correspond à l'un des motifs.properties
-
Array
. un tableau de chaîne de caractères, qui sont les noms des propriétés de l'objettabs.Tab
. Ne déclenchez cet événement seulement pour les changement apportées à l'une des propriétés nommées dans ce tableau. Les propriétés suivantes peuvent être listées ici :- "attention"
- "audible"
- "discarded"
- "favIconUrl"
- "hidden"
- "isArticle"
- "mutedInfo"
- "pinned"
- "sharingState"
- "status"
- "title"
tabId
Integer
. Ne déclenchez cet événement que pour l'onglet identifié par cet ID.windowId
Integer
. N'activez cet événement que pour les onglets qui se trouvent actuellement dans la fenêtre identifiée par cet ID.
Objets supplémentaires
changeInfo
Répertorie les modifications apportées à l'état de l'onglet mis à jour. Pour en savoir plus sur ces propriétés, consultez la documentation tabs.Tab
.
attention
Facultatifboolean
. Indique si l'onglet attire l'attention. Par exemple, lorsque l'onglet affiche un dialogue modal,attention
seratrue
.audible
Facultatifboolean
. Nouvel état audible de l'onglet.discarded
Facultatifboolean
. Si l'onglet est ignoré. Un onglet supprimé est celui dont le contenu a été déchargé de la mémoire, mais est toujours visible dans la bande d'onglets. Son contenu est rechargé la prochaine fois qu'il est activé.favIconUrl
Facultatifstring
. Nouvelle URL de favicon de l'onglet.mutedInfo
Facultatiftabs.MutedInfo
. Le nouvel état muet de l'onglet et la raison du changement.pinned
Facultatifboolean
. Nouvel état épinglé de l'onglet.status
Facultatifstring
. Le statut de l'onglet. Peut être soit chargé ou complet.title
Facultatifstring
. Le nouveau titre de l'onglet.url
Facultatifstring
. L'URL de l'onglet s'il a changé.
Exemples
Écoutez et connectez toutes les informations de changement et nouvel état:
function handleUpdated(tabId, changeInfo, tabInfo) {
console.log("Updated tab: " + tabId);
console.log("Changed attributes: ");
console.log(changeInfo);
console.log("New tab Info: ");
console.log(tabInfo);
}
browser.tabs.onUpdated.addListener(handleUpdated);
Consigner les modifications dans les URL :
function handleUpdated(tabId, changeInfo, tabInfo) {
if (changeInfo.url) {
console.log("Tab: " + tabId +
" URL changed to " + changeInfo.url);
}
}
browser.tabs.onUpdated.addListener(handleUpdated);
Filtering examples
Le journal ne change que pour les onglets dont la propriété url
est matched par "https://developer.mozilla.org/*" ou "https://twitter.com/mozdevnet":
const pattern1 = "https://developer.mozilla.org/*";
const pattern2 = "https://twitter.com/mozdevnet";
const filter = {
urls: [pattern1, pattern2]
}
function handleUpdated(tabId, changeInfo, tabInfo) {
console.log(`Updated tab: ${tabId}`);
console.log("Changed attributes: ", changeInfo);
console.log("New tab Info: ", tabInfo);
}
browser.tabs.onUpdated.addListener(handleUpdated, filter);
Le journal ne change que la propriété épinglée
des onglets (c'est-à-dire les actions d'épinglage et de déblocage) :
const filter = {
properties: ["pinned"]
}
function handleUpdated(tabId, changeInfo, tabInfo) {
console.log(`Updated tab: ${tabId}`);
console.log("Changed attributes: ", changeInfo);
console.log("New tab Info: ", tabInfo);
}
browser.tabs.onUpdated.addListener(handleUpdated, filter);
Combiner les deux filtres précédents : changements de journal seulement :
- A la propriété
épinglée
des onglets - Dont la propriété
url
est matched par "https://developer.mozilla.org/*" ou "https://twitter.com/mozdevnet":
const pattern1 = "https://developer.mozilla.org/*";
const pattern2 = "https://twitter.com/mozdevnet";
const filter = {
urls: [pattern1, pattern2],
properties: ["pinned"]
}
function handleUpdated(tabId, changeInfo, tabInfo) {
console.log(`Updated tab: ${tabId}`);
console.log("Changed attributes: ", changeInfo);
console.log("New tab Info: ", tabInfo);
}
browser.tabs.onUpdated.addListener(
handleUpdated,
filter);
Changements dans le journal seulement :
- A la propriété
épinglée
des onglets - Dont la propriété
url
est matched par "https://developer.mozilla.org/*" ou "https://twitter.com/mozdevnet" - et qui font partie de la fenêtre actuelle du navigateur au moment où l'événement de mise à jour est déclenché :
const pattern1 = "https://developer.mozilla.org/*";
const pattern2 = "https://twitter.com/mozdevnet";
const filter = {
urls: [pattern1, pattern2],
properties: ["pinned"],
windowId: browser.windows.WINDOW_ID_CURRENT
}
function handleUpdated(tabId, changeInfo, tabInfo) {
console.log(`Updated tab: ${tabId}`);
console.log("Changed attributes: ", changeInfo);
console.log("New tab Info: ", tabInfo);
}
browser.tabs.onUpdated.addListener(
handleUpdated,
filter);
Example extensions
Compatibilité du navigateur
BCD tables only load in the browser
The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Cette API est basée sur l'API Chromium chrome.tabs
. Cette documentation est dérivée de tabs.json
dans le code de Chromium code.