Скрыть ссылку с определенным классом и атрибутом

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

  •  03-07-2019
  •  | 
  •  

Вопрос

У меня есть этот html.

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

Как я могу скрыть одну из этих ссылок, используя атрибут href и только последние цифры (233253), чтобы скрыть ссылку с этим атрибутом href и классом "link"?

Это не рабочий код, просто то, что я собрал вместе, чтобы лучше его объяснить.getElementsByTagName('a').class('ссылка').href="*233253"

Обновить:К сожалению, это должен быть чистый javascript, без использования библиотеки, и он должен работать на IE6.

Обновление 2:У меня нет доступа к html

Это было полезно?

Решение 

<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] + "$");
                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>

Редактировать:Я опубликовал новую версию после прочтения вашего комментария об инкапсуляции функциональности внутри функции.Эта версия должна работать так же хорошо, как и предыдущая.

Другие советы

Использование jQuery:

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

Селектор атрибута $= соответствует всем элементам, где выбранный атрибут заканчивается заданным значением.

[Редактировать]:код был несколько неаккуратным, теперь должен сработать.Включая метод разделения (см. Комментарии).

Пройдитесь по элементам a, установите флажок href и примените скрытие.Вот так:

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';
       }
}

или 

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';
   }
}

Без обид, но создание циклов кажется мне обходным путем.Если бы вы могли добавить уникальные идентификаторы к ссылкам, это, очевидно, было бы предпочтительным методом.

После этого вы могли бы использовать 'getElementById', чтобы установить другой класс для скрытия конкретной ссылки.

Что отличает одну ссылку от другой?Если вы знаете, что на стороне сервера, то добавьте соответствующие имена классов, которые будут скрыты статическим образом из CSS.

Динамическое определение того, что нужно скрыть, потребует от вас динамической генерации вашего фрагмента javascript, если только вы не визуализируете это внутри HTML.

Обновить: Если у вас нет доступа к сгенерированному HTML, то мой пост вам не поможет.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top