최초 작성일 : 2023-05-12 | 수정일 : 2023-05-12 | 조회수 : |
HTML
<a>
태그의target
속성은 링크를 클릭했을 때 페이지가 어디에서 열릴지 지정한다.
다음 표에서target
속성의 가능한 값들을 확인해 보자.
속성값 | 설명 |
---|---|
_blank | 링크를 새 창이나 탭에서 연다. |
_self | 링크를 현재 창이나 탭에서 연다. (기본값) |
_parent | 링크를 부모 프레임에서 연다. 부모 프레임이 없는 경우, 이 옵션은 _self 와 같게 작동한다. |
_top | 링크를 현재 창의 최상위 프레임에서 연다. 다른 프레임이 없는 경우, 이 옵션은 _self 와 같게 작동한다. |
frame name | 링크를 지정된 이름의 프레임에서 연다. 해당 이름의 프레임이 없는 경우 새 창이나 탭에서 링크를 연다. |
예를 들어, 링크를 새 창이나 탭에서 열려면 다음과 같이 작성할 수 있다.
html<a href='https://www.example.com' target='_blank'>Visit Example.com</a>
이때, 보안 이슈를 방지하기 위해 rel='noopener'
또는 rel='noreferrer'
를 추가하는 것이 좋다.
이는 새로 열린 페이지가 JavaScript의 window.opener
를 통해 원본 페이지를 조작하는 것을 방지한다.
예를 들면 다음과 같다.
html<a href='https://www.example.com' target='_blank' rel='noopener noreferrer'>Secure link to Example.com</a>