Masquer un lien avec une classe et un attribut spécifiques

StackOverflow https://stackoverflow.com/questions/614064

  •  03-07-2019
  •  | 
  •  

Question

J'ai ce code HTML. 

<a class="link" href="www.website.com?id=233253">test1</a>
<a class="link" href="www.website.com?id=456456">test2</a>

Comment masquer l'un de ces liens en utilisant l'attribut href et uniquement les derniers chiffres (233253) pour masquer le lien avec cet attribut href et la classe "link"?

Ce n'est pas un code qui fonctionne, mais quelque chose que j'ai mis en place pour mieux l'expliquer. getElementsByTagName ('a'). class ('link'). href = "* 233253"

Mise à jour: Malheureusement, il doit s'agir de JavaScript pur, n'utilisant pas de bibliothèque et fonctionnant sous IE6.

Update2: Je n'ai pas accès au HTML

Était-ce utile?

La solution 

<html>
<head>
<script type="text/javascript">

function hideLinks(className, ids) {
    var links = document.getElementsByTagName("a");
    var max   = links.length;

    for (var i=0; i<max; i++) {
        var link   = new RegExp("(\s*)"+ className +"(\s*)");
        var isLink = link.test(links[i].className);

        if (isLink) {
            for (var j=0; j<ids.length; j++) {
                var regexp = new RegExp(ids[j] + "<*>quot;);
                var hasId  = regexp.test(links[i].href);

                if (hasId) {
                    links[i].style.display = "none";
                }
            }
        }
    }
}

window.onload = function() {
    hideLinks("link", [233253]);
}
</script>
</head>
<body>

<a class="link" href="www.website.com?id=233253">test1</a>
<a class="link" href="www.website.com?id=456456">test2</a>


</body>
</html>

Modifier : j'ai publié une nouvelle version après avoir lu votre commentaire sur l'encapsulation de la fonctionnalité dans une fonction. Celui-ci devrait fonctionner aussi bien que la version précédente.

Autres conseils

Utilisation de jQuery: 

$("a.link[href$='233253']").hide();

Le sélecteur d'attribut $ = correspond à tous les éléments où l'attribut sélectionné se termine par la valeur donnée.

[ modifier ]: le code était un peu bâclé, devrait fonctionner maintenant. Y compris la méthode split (voir commentaires).

Parcourez les éléments a, vérifiez href et appliquez le masquage. Comme ceci: 

var refs = document.getElementsByTagName('a');
for (var i=0;i<refs.length;i++) {
       if (
             refs[i].href &&
             refs[i].href.replace(/(\d+$)/,'$1').match('[your value to match]')
          ) {
           refs[i].className = refs[i].className.replace(/link/i,'');
           refs[i].style.display = 'none';
       }
}

OU 

for (var i=0;i<refs.length;i++) {
   var hs = refs[i].href.split(/=/)[1];
   if (  hs.match([your value to match]) ) {
       refs[i].className = refs[i].className.replace(/link/i,'');
       refs[i].style.display = 'none';
   }
}

Ne vous vexez pas, mais créer des boucles me semble une solution de contournement. Si vous pouviez ajouter des identifiants uniques aux liens, ce serait évidemment la méthode préférée.

Après cela, vous pouvez utiliser 'getElementById' pour définir une classe différente masquant le lien en question.

Qu'est-ce qui distingue un lien d'un autre? Si vous le savez du côté du serveur, ajoutez les noms de classe appropriés et ceux qui seront masqués de manière statique au CSS.

Pour déterminer de manière dynamique ce qui doit être masqué, vous devrez générer dynamiquement votre extrait de code javascript, à moins que vous ne le rendiez dans le code HTML.

Mise à jour : si vous n'avez pas accès au code HTML généré, mon message ne vous aidera pas.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top