lien caché javascript

王林
Libérer: 2023-05-12 12:29:07
original
1027 Les gens l'ont consulté

JavaScriptlien caché

Avec le développement rapide d'Internet, le nombre de liens sur Internet augmente également et les gens ont souvent besoin d'utiliser des liens pour obtenir les informations dont ils ont besoin. Cependant, certains liens ne sont pas nécessairement conviviaux : ils sont par exemple trop longs, trop courts, difficiles à identifier et dangereux. À ce stade, nous pouvons utiliser JavaScript pour masquer le lien, le rendant ainsi plus beau, compréhensible et sûr.

liens longs cachés

Parfois, nous ouvrons une page Web et trouvons une longue liste d'URL, ce qui est non seulement difficile à identifier, mais détruit également la beauté de la page. Afin de résoudre ce problème, nous pouvons masquer les liens longs et les afficher en cas de besoin. Cette méthode peut améliorer efficacement l’esthétique et l’expérience de lecture de la page.

Comment y parvenir ? Tout d'abord, ajoutez une balise au code HTML et définissez l'attribut href sur le lien long qui doit être masqué. Ensuite, ajoutez une balise et insérez-y le texte à afficher. Enfin, utilisez le code JavaScript pour masquer ou afficher le lien. L'exemple est le suivant :

<a href="https://www.example.com/this-is-a-really-long-url-that-needs-to-be-hidden">Click me</a>
<span id="link">This is the link</span>

<script>
var link = document.getElementById("link");
var hiddenLink = document.getElementsByTagName("a")[0].href;
link.onclick = function() {
  link.innerHTML = hiddenLink;  // 点击时显示链接
}
</script>
Copier après la connexion

Avec le code ci-dessus, lorsque l'on clique sur "Click me", le lien "https://www.example.com/this-is-a-really-long -url-qui-doit-être-masquée" apparaîtra sur la page.

lien court caché

Parfois, nous devons afficher un lien court sur la page au lieu de l'URL entière. Dans ce cas, nous pouvons masquer le lien complet et afficher uniquement le texte court du lien.

Cette méthode est similaire à la méthode ci-dessus, sauf qu'elle ne nécessite pas que le lien pointe vers un site Web externe, donc JavaScript peut être utilisé pour générer un lien court. Pour cette méthode, nous pouvons utiliser un service similaire à TinyURL pour raccourcir le lien long en une URL plus courte.

Avec le code suivant, on peut utiliser TinyURL pour générer un lien court et le masquer :

<p>Here is the link: <a href="#" id="link">Click me</a></p>

<script>
var longurl = "https://www.example.com/this-is-a-really-long-url-that-needs-to-be-hidden";
var link = document.getElementById("link");
link.innerHTML = "Loading...";  // 显示“加载中”

// 利用TinyURL生成短链接
var xhr = new XMLHttpRequest();
xhr.open("GET", "https://tinyurl.com/api-create.php?url=" + longurl, true);
xhr.onreadystatechange = function() {
  if (xhr.readyState == 4 && xhr.status == 200) {
    var shorturl = xhr.responseText;
    link.innerHTML = shorturl;  // 将短链接显示出来
    link.href = longurl;        // 将链接指向原长链接
  }
};
xhr.send();
</script>
Copier après la connexion

Sur la page, il suffit d'afficher la section "Cliquez-moi" Texte, lorsque l'utilisateur clique, le lien court "https://tinyurl.com/xxx" sera affiché sur la page.

Masquer les liens sécurisés

Parfois, nous devons protéger nos liens afin qu'ils ne soient pas volés ou attaqués par des robots d'exploration ou d'autres programmes malveillants. Dans ce cas, nous pouvons utiliser les capacités de cryptage et de décryptage de JavaScript pour masquer le lien.

Lorsque nous utilisons JavaScript pour crypter un lien, nous pouvons crypter les données du lien afin que les programmes externes ne puissent pas décrypter le lien et empêcher les attaques malveillantes.

Ce qui suit est un exemple simple utilisant JavaScript pour crypter le lien :

<p>Here is the link: <a href="#" id="link">Click me</a></p>

<script>
var link = document.getElementById("link");
var message = "https://www.example.com/this-is-a-secure-link";  // 需要加密的内容

// 将链接内容进行加密处理
var encrypted = btoa(message);
link.innerHTML = "Loading...";  // 显示“加载中”

// 解密链接内容
link.onclick = function() {
  var decrypted = atob(encrypted);
  link.innerHTML = decrypted;  // 显示链接
}
</script>
Copier après la connexion

Dans l'exemple ci-dessus, nous avons utilisé les fonctions btoa() et atob() intégrées de JavaScript, pour crypter et déchiffrer les informations de lien. Lorsque l'utilisateur clique sur le lien, le lien « https://www.example.com/this-is-a-secure-link » s'affichera.

Conclusion

Dans le développement actuel, masquer les liens est une technique très utile qui peut améliorer la beauté, la sécurité et l'expérience utilisateur de la page. Cela nous aide à protéger nos données contre les programmes malveillants et les attaques. Avec le développement continu de JavaScript, nous pouvons utiliser ses différentes fonctions pour masquer et crypter les liens, rendant ainsi nos sites Web plus sûrs et plus beaux.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal