특정 클래스 및 속성이 있는 링크 숨기기

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 속성과 "링크" 클래스가 있는 링크를 숨기려면 href 속성과 마지막 숫자(233253)를 사용하여 이러한 링크 중 하나를 숨기려면 어떻게 해야 합니까?

이것은 작동하는 코드가 아니며 단지 더 잘 설명하기 위해 조합한 것입니다.getElementsByTagName('a').class('link').href="*233253"

업데이트:불행히도 라이브러리를 사용하지 않고 순수 자바스크립트여야 하며 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';
   }
}

범죄는 없지만 루프를 만드는 것은 나에게 해결 방법처럼 보입니다. 고유 한 ID를 링크에 추가 할 수 있다면 분명히 선호하는 방법입니다.

그런 다음 'GetElementById'를 사용하여 특정 링크를 숨기기 위해 다른 클래스를 설정할 수 있습니다.

한 링크를 다른 링크와 구별하는 것은 무엇입니까? 서버쪽에 있다는 것을 알고 있다면 적절한 클래스 이름을 추가하고 CSS에서 정적으로 숨겨 질 것입니다.

HTML 내부에 렌더링하지 않는 한 숨기기가 필요한 것을 동적으로 결정하면 자바 스크립트 스 니펫을 동적으로 생성해야합니다.

업데이트: 생성 된 HTML에 액세스 할 수 없다면 내 게시물은 도움이되지 않습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top