>  기사  >  웹 프론트엔드  >  HTML에서 a 태그 href=""의 여러 용도 소개

HTML에서 a 태그 href=""의 여러 용도 소개

黄舟
黄舟원래의
2017-07-27 13:32:126926검색

우리 모두 알고 있듯이 a 태그의 가장 중요한 기능은 하이퍼링크와 앵커를 구현하는 것입니다. 게다가 대부분의 사람들은 a 태그의 가장 중요한 역할이 하이퍼링크를 구현하는 것이라고 생각합니다. 오늘 저는 우연히 a 태그 dc296d7ae6e6f15e7743dfda54c79fbb5db79b134e9f6b82c0b36e0489ee08ed를 작성하는 방법을 발견했습니다. 그래서 정리하겠습니다. 다음은 a 태그에서 href의 여러 용도입니다.

1. Js의 여러 호출 메소드(요약 참조)

1.

a href="javascript:j
s_method();"

흔히 사용하는 메소드인데, 아래와 같은 파라미터를 전달하는 메소드입니다. 문제가 발생하기 쉬우며 a의 href 속성으로 javascript: 프로토콜을 사용하면 window.onbeforeunload 이벤트가 불필요하게 발생할 뿐만 아니라 IE에서 gif 애니메이션 사진 재생이 중단되는 원인이 됩니다. W3C 표준에서는 href
2.

 a href="javascript:void(0);" onclick="js_method()"

이 방법은 많은 웹사이트에서 가장 일반적으로 사용되는 방법이자 가장 포괄적인 방법이기도 합니다. onclick 방법은 js 기능 실행을 담당합니다. void는 연산자이고 void(0)은 정의되지 않은 값을 반환하며 주소는 점프하지 않습니다. 그리고 이 메서드는 첫 번째 메서드처럼 js 메서드를 브라우저의 상태 표시줄에 직접 노출하지 않습니다.
3.

a href="javascript:;" onclick="js_method()"

이 방법은 2가지 방법과 유사하지만 유일한 차이점은 빈 js 코드가 실행된다는 점입니다.
4.

a href="#" onclick="js_method()"

이 메소드도 인터넷에서 아주 흔히 볼 수 있는 코드인데, #은 태그에 내장된 메소드로, top의 역할을 나타냅니다. 따라서 이 방법을 사용하여 웹페이지를 클릭하면 페이지 상단으로 돌아갑니다.

5.

a href="#" onclick="js_method();return false;"

이 메소드는 js 함수를 실행하기 위해 클릭한 후 false를 반환하며 페이지는 점프하지 않으며 실행 후에도 여전히 페이지의 현재 위치에 있습니다.
위 내용을 바탕으로 a에서 js 함수를 호출하는 가장 적절한 방법을 권장합니다.



2. 에서 href="#"의 역할

href="#" 맨 위로 돌아가는 것을 의미합니다. 현재 페이지에서 스크롤해야 하는 경우 이 방법으로 바로 맨 위로 돌아갈 수 있습니다. 예를 들어 일부 웹 사이트에서는 오른쪽 하단에 아이콘 버튼을 만들어 상단으로 돌아가도록 구현하는 간단한 방법을 고려해 볼 수 있습니다.

<span style="font-size:14px;"><a href="#">回到最顶端</a></span>

3. href="URL"의 역할

1. URL은 절대 URL입니다

이때는 다른 사이트를 가리킵니다.

href="http://write.blog.csdn.net"

처럼 클릭하면 이 링크의 페이지로 바로 이동합니다.

2. URL은 상대 URL입니다.

이때 href="/test.doc"와 같이 사이트에 있는 파일을 가리키며, 파일을 클릭하면 바로 다운로드됩니다. .

3. 앵커 URL

이때 href="#top"과 같이 페이지 내의 앵커를 가리키다가 클릭하면 id="top인 앵커 포인트로 이동합니다. " 현재 페이지에서 현재 페이지를 실현하는 소위 점프입니다. 가장 일반적인 용도는 스크롤 가능한 페이지에 메뉴를 추가하여 페이지의 특정 부분으로 직접 돌아가는 것입니다.

즉, 세 가지 코드 샘플이 모두 다음과 같습니다.

<a href="http://baidu.com">超链接</a>
<a href="#">回到最顶端</a>
<a href="css/css1.css">文件链接</a>

위 내용은 HTML에서 a 태그 href=""의 여러 용도 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.