링크에 파운드 "#"기호가 있으면 무엇입니까?


94

일부 사이트를 조사한 결과 URL에 파운드 (#) 기호가 있습니다. 그것은 무엇을합니까?

 <a href="#" >Link name</a>

답변:


106

"조각"또는 "명명 된 앵커"입니다. 문서의 일부 에 링크하는 데 사용할 수 있습니다 . 일반적으로 페이지에 링크하면 브라우저가 페이지 상단에서 열립니다. 하지만 중간에있는 섹션에 연결하면 조각을 사용하여 해당 제목 (또는 기타)에 연결할 수 있습니다.

<a name="whatever"/>페이지 내에 태그 가없는 경우 브라우저는 페이지 상단으로 연결됩니다. 조각이 비어 있으면 페이지 상단으로 만 링크됩니다.

조각의 경우에만 현재 페이지 <a href="#">Link name</a>의 상단에 대한 링크 입니다.

자바 스크립트와 함께 사용되는 링크를 자주 볼 수 있습니다. 표준을 준수하는 HTML에는 href속성이 필요 하지만 자바 스크립트로 요청을 처리하려는 경우 "#"이 적절한 자리 표시 자 역할을합니다.


1
+1 공식 용어는 "해시 참조"가 아니라 URL 조각이지만 : w3.org/TR/WD-html40-970708/htmlweb.html#h-4.1.1
Jason Hall

네, 대답에서 "조각"으로 변경했습니다. 대부분의 사람들이 사용하는 것이기 때문입니다. 나는 :)하지만 "공식적인"이름을 알고 있었다 결코
딘 하딩을

2
브라우저에서 '페이지 맨 위로 이동'으로 처리하는 이유 : 기술적으로 페이지를 변경했습니다. 링크를 클릭하면 주소 표시 줄의 URL에 실제로 #이 추가 된 것을 알 수 있으며 뒤로 버튼을 클릭하면 다시 제거됩니다. 문서의 일부에 대한 링크가 아니라 문서 내부의 위치에 대한 링크라고 말하고 싶지 않습니다. 그렇지 않으면 기본적으로 내가 타이핑했던 것과 똑같습니다 ...
animuson

#로 끝나는 URI는 일반 구문에서 허용되며 일종의 빈 조각으로 간주 될 수 있습니다. text / html 또는 모든 XML 유형과 같은 MIME 문서 유형에서이 구문 상 법적 구조와 일치하는 빈 식별자는 허용되지 않습니다. 웹 브라우저는 일반적으로 빈 조각에 대해 문서 상단을 표시합니다. - en.wikipedia.org/wiki/Fragment_identifier
IcyBrk

또한 의해 "그런 표현이 존재하지 않는 경우, 조각의 의미를 알 수없는 것으로 간주하고 효과적으로 구속되어 있습니다."RFC3986에서 ( tools.ietf.org/html/rfc3986#page-24 )
IcyBrk

23

... 몇 가지 유용한 팁을 추가하기 위해

document.location.hashJavaScript로 접근하고 변경할 수 있습니다 .

그것은 지정된 앵커 (예를 가리킬 수있다 <a name="top"></a>) 또는 해당 ID (예와 소자 <div id="top"></div>).

하나만 볼 수 있다는 것은 <a href="#" onclick="pop()">popup</a>일반적으로 링크가 JavaScript를 독점적으로 실행하는 데 사용되고 있음을 의미합니다. 이것은 나쁜 습관입니다.

모든 a요소 href에는 유효한 리소스를 가리키는가 있어야합니다. 존재하지 않는 경우 button.


1
그것은 그것에 대한 좋은 점입니다. 특별히 좋은 연습은 아닙니다 ... 그러나 그것이 좋지 않다고해서 그것이 모든 곳에서 그렇게 사용되지 않는다는 것을 의미하지는 않습니다. :)
Dean Harding

1
@alex, 나쁜 습관이라면 대신 사용 하는 것이 좋은 방법 을 알려주십시오 .
Ryan Lundy

@Kyralessa 그것은 바로 다음 단락에있었습니다. 어쨌든 나는 편집을 했으므로 더 명확하기를 바랍니다.
alex

2
@alex, 아마도 사람들이 버튼 대신 링크를 사용하는 한 가지 이유는 링크 모양을 원하기 때문일 것입니다. 버튼을 링크처럼 보이게하는 방법을 설명하는 페이지에 대한 링크는 어떻습니까? 예 : HTML 버튼 테스트
Ryan Lundy

1
@alex, 링크에서 #을 사용하는 것이 나쁜 습관이라고 말하는 것 이상입니다. 요청 된 모든 OP는 그것이하는 일입니다.
Ryan Lundy

11

# 앵커에 대한 링크를 나타냅니다.

나는 또한 다른 것을 언급 할 것이다 :

JavaScript를 활성화하는 링크의 href로 '#'을 사용하는 것은 페이지를 맨 위로 스크롤하기 때문에 좋지 않습니다. 대신 javascript:void(0).


이러한 링크를 클릭하면 페이지가 맨 위로 스크롤된다는 것을 언급하는 +1.
Chris Calo 2011

4
더 이상 닻이 필요하지 않습니다. HTML5 (및 HTML 4)부터는 <id> 태그가있는 모든 요소가 조각 식별자의 대상이 될 수 있습니다. HTML5의 문서를 참조하십시오 : whatwg.org/specs/web-apps/current-work/multipage/...
바질 우르 큐

2
javascript:void(0)둘 중 하나를 사용하지 마십시오 button. 링크가 아닌 경우 a를 사용하십시오.
alex

11

파운드 기호 ( #)는 페이지에서 앵커 위치를 나타냅니다. 예를 들어 페이지의 어딘가에 다음을 포함하는 경우 :

<a name="foo"></a>

또는 최근에 :

<div id="foo">*part of page*</div>

그런 다음 href가있는 페이지에서 링크를 클릭 #foo하면 이름 또는 divID 가있는 앵커로 이동합니다 foo.

그러나 href 만 있으면 #페이지 상단으로 이동합니다.


2

이것은 페이지 자체로 다시 링크됩니다. 실제로 일부 JavaScript를 실행하는 링크와 함께 자주 사용됩니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.