href 식의 역할은 무엇입니까?

href 식의 역할은 무엇입니까?

저는 웹페이지에서 다음과 같은 href를 가끔 보았습니다.하지만, 나는 이것이 무엇을 하려는 것인지, 그리고 기술을 이해 할 수 없다.누가 좀 자세히 설명해 주시겠어요?

<a href="javascript:;"></a>

안<a>이 없는 한 하지 않은HTML이 .href ★★★★★★★★★★★★★★★★★」name여하하다

렌더링 하는 경우친 , 포인터 에는, 「」( 「안내」 「안내」 「안내」 「안내」 「안내」 「안내」 「안내」)가 에만 렌더링 .href여하하다

이와 는 링크를될 수 을 URL에 .href하지 이 그가 있는 가장 이었다.개발자는 분명히 링크 자체가 아무것도 하지 않기를 원했고 이것이 그가 알고 있는 가장 쉬운 방법이었다.

링크를 했을 때 실제로 코드를 이다. 그는 인 자바스크립트처럼 .그것은 실제로 일어나고 싶은 일이지만, 그는 그것이 일반적인 것처럼 보이기를 원한다.<a>태그 링크

에 따라서는 ★★★★★★★★★★★★를 사용하고 있는 경우도 있습니다.href='#'이 경우 브라우저가 페이지 맨 위로 이동하며 이는 필요하지 않을 수 있습니다.는 단순히 href를 수 . 그는 href를 비워둘 수 없었다.href=''는 현재 페이지로 돌아가는 링크입니다(페이지 새로고침의 원인이 됩니다).

을 사용법href그 중 하나이며, 최선의 해결책은 아니지만 효과가 있습니다.

기본적으로 링크를 사용하여 페이지(또는 앵커)를 이동하는 대신 이 방법을 사용하면 Javascript 기능이 실행됩니다.

<script>
function doSomething() {
  alert("hello")
}
</script>
<a href="javascript:doSomething();">click me</a>

링크를 클릭하면 경보가 울립니다.

링크가 수신처에 도달하지 않도록 하는 메커니즘이 몇 가지 있습니다.질문에서 나온 것은 그다지 직관적이지 않다.

은 '하다'를 사용하는 입니다.href="#no"서 ''는#no는 문서에서 정의되지 않은 앵커입니다.

#disable 또는 #action과 같은 보다 의미 있는 이름을 사용하여 가독성을 높일 수 있습니다.

이 접근방식의 이점:

• 빈 href="#"의 "최상단으로 이동" 효과를 방지합니다.
• javascript 사용을 회피합니다.

결점:

• 문서에 앵커 이름이 사용되지 않아야 합니다.
• URL이 변경되어 (존재하지 않는) 앵커가 fragment로 포함되어 새로운 브라우저 이력 엔트리가 생성됩니다.즉, 링크를 클릭한 후 "뒤로" 버튼을 클릭하면 예상대로 작동하지 않습니다.

그 이후로는<a>요소가 링크로 동작하지 않습니다.이러한 경우, 최선의 옵션은, RACE를 사용하지 않는 것입니다.<a>단 하나의 요소<div>원하는 링크 스타일을 제공합니다.

<a href="javascript:alert('Hello');"></a>

는 다음의 약어일 뿐입니다.

<a href="" onclick="alert('Hello'); return false;"></a>

이는 링크를 클릭했을 때 아무런 작업도 하지 않도록 하는 방법입니다(Javascript 이벤트가 링크에 바인딩되지 않은 경우).

이는 링크를 따라가지 않고 Javascript를 실행하는 방법입니다.

<a href="Javascript: doStuff();">link</a>

실제로 실행할 javascript가 없는 경우(예시와 같이)는 아무것도 하지 않습니다.

js 코드를 쓸 때 사용합니다.href듣는 사람이 좋아하는 이벤트 대신onclick회피하고 있다#링크href만들기 위해서a태그는 HTML에 유효합니다.

흥미로운 사실

사용법에 대해 조사를 했습니다.javascript:의 내부에href속성에 여러 줄을 쓸 수 있다는 결과가 나왔어요!

<a href="
     javascript:
        a = 4;
        console.log(a++); 
        a += 2; 
        console.log(a++); 
        if(a < 6){ 
            console.log('a is lower than 6');
        } 
        else 
            console.log('a is greater than 6');
        function log(s){
            console.log(s);
        }
        log('function implementation working too');

">Click here</a>

• 크롬 버전 68.0.3440.106(공식 빌드)(64비트)에서 테스트 완료

• Firefox Quantum 61.0.1(64비트)에서 테스트 완료

다음을 참조하십시오.

<a href="Http://WWW.stackoverflow.com">Link to the website opened in different tab</a>
<a href="#MyDive">Link to the div in the page(look at the chaneged url)</a>
<a href="javascript:;">Nothing happens if there is no javaScript to render</a>

<a href="javascript:void(0);"></a>

javascript:브라우저에 javascript 코드를 작성하도록 지시합니다.

오래된 스레드입니다만, 개발자가 이 컨스트럭트를 사용하는 이유는 데드링크를 작성하기 위해서가 아니라, javascript URL이 어떤 이유로 액티브한 html 요소에 대한 참조를 올바르게 전달하지 않기 때문입니다.

예.handler_function(this.id)로서 기능하다onClickjavascript URL은 아닙니다.

따라서 각 하이퍼링크의 호출을 수동으로 조정해야 하는 표준 준거 코드를 교육적으로 작성할 것인지, 아니면 한 번 작성하여 어디에서나 사용할 수 있는 약간 비표준 코드를 작성할 것인지를 선택할 수 있습니다.

이것은 스타일링의 문제이기 때문에 HTML을 잘못된 구문으로 오염시키는 대신 W3의 유효한 회피책을 사용할 수 있습니다.

1. HTML 의 포맷을 올바르게 실시합니다.href버튼의 W3 접근성 가이드 행에 따릅니다.
2. CSS를 사용하여 클릭 가능한 UX 효과를 컨트롤에 적용하는 초기 목표를 수정합니다.

다음은 UX를 사용해 볼 수 있는 실제 예입니다.

HTML

    <a role="button" aria-pressed="false">Underlined + Pointer</a>
    <a role="button" aria-pressed="false" class="btn">Pointer</a>

CSS

    a[role="button"]:not([href]):not(.btn) { text-decoration: underline; }
    a[role="button"]:not([href]) { cursor: pointer; }

페이지를 갱신하지 않고, iPad와 전화기에 메뉴 항목을 여는 솔루션을 찾고 있었습니다.모바일로도 해봤는데 잘 되네.

<a href="#" onclick="return false;">Dr</a>

    1. Use that java script to Clear an HTML row Or Delete a row using the id set to a span and use JQuery to set a function to that span's click event.
    2. Dynamically set the div html to a string variable and replace {id} with a 1 or 2 etc. cell of a larger div table and rows

<div class="table-cell">
    <span id="clearRow{id}">
        <a href="javascript:" style-"color:#c32029; align:right; font-size:8pt;">Clear</a>
    </span>
</div>

<div class="table-cell">
   <span id="deleteRow{id}">
       <a href="javascript:" style-"color:#c32029; align:right; font-size:8pt;">Delete</a>
   </span>
</div>

//JQuery - Clear row
$("#clearRow" + idNum).click(function(){
    $("someIDOrWildcardSelector" + idNum).val("");
    $("someIDOrWildcardSelector" + idNum).val("");
    $("someIDOrWildcardSelector" + idNum).val("");
});

//JQuery to remove / delete an html row
$("#deleteRow" + idNum).click(function(){
    //depending upon levels of parent / child use 1 to many .parent().parent().parent()
    $(this).parent().remove();
});

언급URL : https://stackoverflow.com/questions/7755088/what-does-href-expression-a-href-javascript-a-do