HTML Anchor를 'name'으로 만들어야 하나요, 아니면 'id'로 만들어야 합니까?

HTML Anchor를 'name'으로 만들어야 하나요, 아니면 'id'로 만들어야 합니까?

http://example.com/#foo use" (사용할 )

<h1><a name="foo"/>Foo Title</h1>

또는

<h1 id="foo">Foo Title</h1>

둘 다 효과가 있지만, 같은가, 아니면 의미적인 차이가 있는가?

HTML 5 사양, 5.9.8 프래그먼트 식별자에 대한 네비게이션:

HTML 문서(및 텍스트/html MIME 유형)의 경우 문서의 표시된 부분을 확인하려면 다음 처리 모델을 따라야 합니다.

1. URL 을 해석해, fragid 를 URL 의<fragment> 컴포넌트로 합니다.
2. fragid가 빈 문자열인 경우 문서의 표시된 부분은 문서의 맨 위입니다.
3. DOM 에 fragid 와 완전히 같은 ID 를 가지는 요소가 있는 경우는, 이러한 요소의 트리 순서는 문서의 지정 부분이며, 여기서 알고리즘을 정지합니다.
4. 값이 fragid와 정확히 동일한 이름 속성을 가진 요소가 DOM에 있는 경우, 트리 순서대로 첫 번째 요소가 문서의 지정된 부분입니다. 여기서 알고리즘을 중지하십시오.
5. 그렇지 않으면 문서에 표시된 부분이 없습니다.

그래서 '아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 아, 네요.id="foo" 을 붙일 거예요.name="foo"

와 같이 의 경우: @hsivonen은 HTML5를 사용합니다.a요소에 이름 속성이 없습니다.단, 위의 규칙은 다른 이름 있는 요소에도 적용됩니다.

하면 안 요.<h1><a name="foo"/>Foo Title</h1>합니다.text/html 빈 은 XML에서되지 않기 text/html<h1><a name="foo">Foo Title</a></h1>HTML4의 OK.HTML5를 사용하다

<h1 id="foo">Foo Title</h1>HTML4 5 HTML5 、 OK 。Netscape 4 에서는 동작하지 않지만, Netscape 4 에서는 동작하지 않는 12개의 다른 기능을 사용할 수 있습니다.

이 페이지에서 해당 영역에 링크할 예정이라면...예를 들어 page.html#foo나 FooTitle은 사용할 필요가 없는 링크입니다.

<h1 id="foo">Foo Title</h1>

「」를 , 「」를 붙입니다.<a>은 will신 an an an an an an an an an an an an an an 의 영향을 받습니다.<a>CSS를 사용하다이건 그냥 추가 가격일 뿐이고, 필요 없을 거예요.헤드라인에 ID를 붙이는 것이 좋을 뿐만 아니라 Javascript 또는 CSS에서 해당 오브젝트를 지정할 수 있습니다.

Wikipedia에서는 이 기능을 다음과 같이 많이 사용하고 있습니다.

<a href="#History">[...]</a>
<span class="mw-headline" id="History">History</span>

위키피디아는 모두에게 효과가 있기 때문에저는 이 양식을 가지고 있어도 안심할 수 있습니다.

또한 스팬뿐만 아니라 div 또는 테이블 셀에서도 사용할 수 있습니다.그러면 요소의 :target pseudo-class에 액세스할 수 있습니다.굵은 글씨처럼 가로 세로 폭을 변경하지 않도록 주의해 주세요.왜냐하면, 컨텐츠가 이동하기 때문에, 방해가 됩니다.

지명된 앵커 - 내 투표는 피하는 것이다:

• "이름과 ID가 같은 네임스페이스에 있습니다." - 네임스페이스가 같은2개의 Atribute는 crazy일 뿐입니다.이미 추천을 안 받은 걸로 합시다.
• "Href 속성 없는 앵커 요소" - 다시 한 번 요소의 특성(하이퍼링크 여부)은 속성을 갖는 것으로 정의됩니다.두 배로 미쳤네.상식적으로 다 피하라고 합니다.
• 유사 클래스 없이 앵커 스타일을 지정하면 스타일링이 각 클래스에 적용됩니다.CSS3에서는 Atribute Selector(또는 의사 클래스마다 같은 스타일)를 사용하여 이 문제를 회피할 수 있지만 여전히 회피책입니다.보통 유사 클래스별로 색상을 선택하기 때문에 표시되지 않습니다.기본적으로 밑줄은 삭제만 가능하기 때문에 다른 텍스트와 동일합니다.하지만 링크를 굵게 하려고 하면 문제가 생깁니다.
• Netscape 4는 ID 기능을 지원하지 않을 수 있지만 알 수 없는 속성으로 인해 문제가 발생하지 않습니다.그게 바로 호환성입니다.

<h1 id="foo">Foo Title</h1>

사용해야 하는 것입니다.링크를 원하지 않는 한 앵커를 사용하지 마십시오.

JavaScript 사용자용 주의사항: 모든 ID는 에서 글로벌 변수가 됩니다.

<h1 id="foo">Foo Title</h1>

JS global을 방금 작성했습니다.

window.foo

「」의 값window.foo will will will will will will will will will가 되다HTMLElement★★★★★★★★★★★★★★★★의 경우h1.

에서 되는 모든 할 수 한id '아트리뷰트'를 고수하는 을 선호할 수도 .사용자는 이 속성을 고수하는 것을 선호할 수 있습니다.name:

<h1 name="foo">Foo Title</h1>

의미적 차이는 없습니다. 표준의 경향은 다음과 같습니다.idname'보다', '보다 낫다', '보다 낫다'를 선호하게 가 있습니다name경우에 따라서는.HTML 4.01 사양은 다음과 같은 힌트를 제공합니다.

id ★★★★★★★★★★★★★★★★★」name은 사용 할 때 해야 합니다.id ★★★★★★★★★★★★★★★★★」name'이것'은 다음과 같습니다.

• id 속성은 단순한 앵커 이름(스타일 시트 선택기, 식별자 처리 등) 이상의 역할을 할 수 있습니다.
• 일부 이전 사용자 에이전트는 id 속성을 사용하여 작성된 앵커를 지원하지 않습니다.
• name Atribut을 사용하면 (엔티티가 있는) 앵커 이름이 더 풍부해집니다.

ID 메서드는 이전 브라우저에서는 사용할 수 없습니다. 앵커 이름 메서드는 최신 HTML 버전에서 더 이상 사용되지 않습니다.아이디로 하겠습니다.

에서는 html 5의id=""를 정의합니다 링크의 .fragment는 fragment를 나타냅니다.에서는 'HTML'은name=""「」의 <a> linkfragment 의 앵커를 정의합니다.하다
<a name="foo" id="foo"></a><h1>Foo Title</h1>
" " "는 되기 때문입니다.id=""Atribute는 약간 얼룩이 있습니다(모든 메이저브라우저의 최신 릴리스가 이를 지원하지만 몇 년도 지나지 않은 릴리스는 (그리고 정당한 이유가 없다면 무언가를 파손하지 않는 것이 가장 좋습니다).closing는 아직요소 내의 것을 할합니다.closing </a>는 link'd에 포함되어 있습니다.

하세요.name="" ★★★★★★★★★★★★★★★★★」id=""의 <a>요소는 동일합니다.

웹 페이지는 여러 개의 div 컨테이너로 구성되어 있으며 형식은 같고 일련 번호만 다릅니다.각 div의 맨 위에 anchor라는 이름을 숨기고 싶었기 때문에 가장 경제적인 해결책은 anchor를 id로 여는 div 태그에 포함시키는 것이었습니다.

<div id="[serial number]" class="topic_wrapper">

두 번째 예에서는 해당 요소에 고유 ID를 할당합니다.그런 다음 DHTML을 사용하여 이 요소를 조작하거나 액세스할 수 있습니다.

반면 첫 번째 항목은 문서 내에서 북마크와 같은 명명된 위치를 설정합니다."앵커"에 부착하면 완벽하게 말이 됩니다.

마크업에 대한 관찰 이전 버전의 HTML에서 마크업 양식은 앵커 포인트를 제공했습니다.HTML5에서 id 속성을 사용하는 마크업 폼은 대부분 동일하지만 식별하기 위해 요소가 필요합니다.이들 대부분은 일반적으로 콘텐츠를 포함할 것으로 예상됩니다.

예를 들어 빈 스팬이나 div를 사용할 수 있지만 이 사용법은 퇴화되어 보입니다.

이 목적으로 wbr 요소를 사용하는 것이 하나의 방법입니다.wbr에는 빈 콘텐츠 모델이 있으며 줄 바꿈이 가능하다고 선언합니다.이것은 마크업 태그를 약간 불필요하게 사용하는 것이지만, 불필요한 문서 분할이나 빈 텍스트 범위보다 훨씬 적은 것입니다.

오래된 브라우저의 이름 애트리뷰트와 새로운 브라우저의 ID 애트리뷰트를 사용하는 것은 어떨까요?두 가지 옵션이 모두 사용되며 기본적으로 폴백 방식이 구현됩니다.

2021년에는 IE6보다 오래된 브라우저에 관심을 가질 사람이 누가 있을까요?

Stackoverflow는 아직 'name' 속성 대신 anchor 및 'name' 속성을 사용하고 있습니다.

왜요?

왜냐하면 당신은:

1. SINGLE 요소에 ID 값을 두 개 지정할 수 없습니다.

#sample
{
  color: red; 
}

<div id="postNr4245 sample"> Sample text </div>  <!-- coloring doesn't work -->

<a href="#postNr4245">Jump to Post</a> <!-- jumping doesn't work -->

좋아요, 'class'는 그런 것들을 위해서 쓸 수 있어요.

맞는 말이지만 사이트에서 스타일링할 필요가 있는 요소가 하나밖에 없다면 클래스를 사용하지 않는 것이 좋습니다.

왜요?

CSS 셀렉터 #idName을 사용하여 웹 브라우저를 검색하면 해당 요소가 더 이상 검색되지 않기 때문입니다.웹 사이트의 로딩 속도가 빨라집니다.

.class를 사용하는 경우 웹 브라우저에서는 .class를 한 번 이상 사용했는지 알 수 없기 때문에 DOM의 모든 위치를 찾아야 합니다.

2. CSS에서 'id' 값을 스타일링하거나 JS를 사용하여 해석하는 경우 숫자로 시작할 수 없습니다.그러나 'name' 값은 숫자로 시작할 수 있습니다.

"named anchor" 개념 전체가 이름 속성을 사용합니다.이름만 사용하시면 됩니다만, javascript 상황에 따라서는 ID 속성이 편리할 수 있습니다.

코멘트와 같이, 항상 양쪽 모두를 사용해 베팅의 위험을 회피할 수 있습니다.

언급URL : https://stackoverflow.com/questions/484719/should-i-make-html-anchors-with-name-or-id