[DOM_Document] JS - anchors 속성 - name 속성 갖은 모든 앵커태그집합 반환 (=anchors속성 = 앵커즈 속성)

목차

1. anchors 예제 - name 속성 갖은 모든 앵커태그집합 반환
2. anchors 정의
3. anchors 구문
4. anchors 소속 속성
5. anchors 소속 메서드
6. anchors 예제 - name 속성 갖는 첫 번째 <a> 접근

anchors 예제 - name 속성 갖은 모든 앵커태그집합 반환

 

<a href='https://homzzang.com/b/html'>HTML</a><br>

<a name="css" href='https://homzzang.com/b/css'>CSS</a><br>

<a name="php" href='https://homzzang.com/b/php'>PHP</a><br>

<a name="sql" href='https://homzzang.com/b/sql'>SQL</a><br>

<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>

function homzzang() {

  var x = document.anchors.length;

  document.getElementById("demo").innerHTML = x;

}

</script>

 

결과보기

결과값: 3

anchors 정의

 

name 속성 갖은 모든 <a> 태그 모음

 

---

 

1.

<a> 태그의 name 속성은 HTML5에서 지원 X.

 

2.

<a> 태그 모음 안의 요소들은 소스 코드에 있는대로 정렬.

 

3.

관련파트 : Anchor 객체 , document.links

 

4.

모든 브라우저 지원

anchors 구문

 

document.anchors

 

---

[반환값]

 

name 속성 갖는, 문서 안 모든 a 태그 집합인 HTMLCollection 객체 반환.

 

anchors 소속 속성

 

length

name 속성 갖는 <a> 요소 개수 반환. (읽기 전용)

 

anchors 소속 메서드

 

[index]

지정 색인번호의 name 속성 갖는 <a> 요소 반환.

※ 색인번호는 0부터 시작함.

※ 색인번호가 범위 밖일 때, null 반환.

 

item(index)

지정 색인번호의 name 속성 갖는 <a> 요소 반환.

※ 색인번호는 0부터 시작함.

※ 색인번호가 범위 밖일 때, null 반환.

 

namedItem(id)

지정 id 갖는 컬렉션에서 <a> 요소 반환.

※ 지정 id 비존재 시, null 반환.

 

anchors 예제 - name 속성 갖는 첫 번째 <a> 접근 

 

<a name="html">HTML 강의</a><br>

<a name="css">CSS 강의</a><br>

<a name="php">PHP 강의</a><br>

<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>

function homzzang() {

  var x = document.anchors[0].innerHTML;

  document.getElementById("demo").innerHTML = x;

}

</script>

 

결과보기 (결과값: HTML 강의)