Script jsfavori : Ajouter un bouton de commande JavaScript dans les favoris

Créer un bouton JavaScript dans la barre de favoris, utilisables sur tous les sites consultés

Partie III : Pour aller encore plus loin avec JavaScript

Edition 1 | Chapitre 25 : Créer une extension de navigateur / Page 332

Edition 2 | Chapitre 26 : Créer une extension de navigateur / Page 378

Edition 3 | Chapitre 26 : Créer une extension de navigateur / Page 378

<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ajouter du JavaScript dans un favori</title>
</head>
<body>
<h1>Ajouter du JavaScript dans un favori</h1>
<h2>Du JavaScript dans un lien href</h2>
<a href="javascript:void(document.body.style.background='#ccc')">Passer le fond en gris</a>
<h2>Notre lien JavaScript qui affiche l'adresse IP</h2>
<p>1 Cliquez sur le bouton pour vérifier qu'il fonctionne</p>
<p>2 Ajoutez ce lien dans la barre de favoris en drag and drop</p>
<a class="btn" href="javascript:void((function()%7Biframe%3Ddocument.createElement(%22iframe%22)%3Biframe.setAttribute(%22width%22%2C%20%22210%22)%3Biframe.setAttribute(%22height%22%2C%20%2240%22)%3Biframe.setAttribute(%22style%22%2C%20%22position%3Afixed%3Bleft%3A2px%3Btop%3A2px%3B%20border%3A1px%20solid%20%23000%3Bbackground%3A%23fff%3Bz-index%3A10000%3B%22)%3Biframe.setAttribute(%22src%22%2C%20%22https%3A%2F%2Fwww.toutjavascript.com%2Fapi%2Fiframeip.php%22)%3Bdocument.body.appendChild(iframe)%3B%7D)())">Mon IP</a>
<style type="text/css">a.btn {display:inline-block;margin:5px;padding:6px;border:1px solid #000;border-radius: 5px;cursor: pointer; background:#fff;color:#000;text-decoration: none;}a.btn:hover {color:#fff;background: #000 !important; }
</style>
</body>
</html>

Exécution du script

Emulation de la console

Code source

<html><head><meta name="viewport" content="width=device-width, initial-scale=1"><title>Ajouter du JavaScript dans un favori</title></head><body><h1>Ajouter du JavaScript dans un favori</h1><h2>Du JavaScript dans un lien href</h2><a href="javascript:void(document.body.style.background='#ccc')">Passer le fond en gris</a><h2>Notre lien JavaScript qui affiche l'adresse IP</h2><p>1 Cliquez sur le bouton pour vérifier qu'il fonctionne</p><p>2 Ajoutez ce lien dans la barre de favoris en drag and drop</p><a class="btn" href="javascript:void((function()%7Biframe%3Ddocument.createElement(%22iframe%22)%3Biframe.setAttribute(%22width%22%2C%20%22210%22)%3Biframe.setAttribute(%22height%22%2C%20%2240%22)%3Biframe.setAttribute(%22style%22%2C%20%22position%3Afixed%3Bleft%3A2px%3Btop%3A2px%3B%20border%3A1px%20solid%20%23000%3Bbackground%3A%23fff%3Bz-index%3A10000%3B%22)%3Biframe.setAttribute(%22src%22%2C%20%22https%3A%2F%2Fwww.toutjavascript.com%2Fapi%2Fiframeip.php%22)%3Bdocument.body.appendChild(iframe)%3B%7D)())">Mon IP</a><style type="text/css">  a.btn {    display:inline-block;    margin:5px;    padding:6px;    border:1px solid #000;    border-radius: 5px;    cursor: pointer;      background:#fff;    color:#000;    text-decoration: none;  }  a.btn:hover {    color:#fff;    background: #000 !important;    }</style></body></html>

Troisième édition Tout JavaScript chez Dunod

En savoir plus
Sortie le 4 janvier 2023

Version papier 29€90
Format électronique 22€99.

Commandez en ligne

Dunod Fnac Amazon

Le graph des objets JavaScript

Chargement
en cours...