반응형
Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 | 29 |
30 | 31 |
Tags
- thymeleaf
- springboot
- mybatis
- java
- spring
- 스프링 컨테이너
- 스프링 빈
- 스프링부트
- DI
- @Configuration
- jdbc
- Effective Java
- resultMap
- assertThat
- DIP
- 싱글톤
- 스프링
- Javascript
- 스프링 부트 입문
- SQL
- db
- JPA
- kafka
- sqld
- 스프링 부트
- 생성자 주입
- 스프링 프레임워크
- 스프링 부트 기본
- 필드 주입
- assertThrows
Archives
- Today
- Total
선 조치 후 분석
[JavaScript] a(Anchor) 태그 onclick, href 차이? 본문
728x90
반응형
SMALL
프로젝트를 진행하면서, 가끔 앵커 태그(a태그)에 어떤 경우는 'href'에 javaScript 함수가 정의되어 있고, 어떤 경우에는 onClick에 정의되어 있는 것을 본 적이 있다. 그래서 어떤 차이가 있는지 궁금해서 구글링을 해보았다.
코드로 보는 게 더 이해가 빠를 거 같다.
function checkAnchor(obj){
console.log($(obj).attr('attr-check'));
}
<a attr-check="onclick:attr-check" href="javascript:checkAnchor(this);"> </a>
<a attr-check="onclick:attr-check" onclick="javascript:checkAnchor(this);"> </a>
결과
1) href - undefined
2) onclick - onclick:attr-check
위처럼 href로 함수 호출 시, 자기 자신의 object를 찾지 못해 undefined를 표시하게 된다.
하지만, onclick을 사용하면 정상적으로 자기 자신 this가 인식되어 속성을 표시하게 된다.
즉, 앵커 태그에서 함수 호출 시, 자기 자신 객체를 전달할 때는 'onclick'을 사용해야 한다.
728x90
반응형
LIST
'Language > JavaScript' 카테고리의 다른 글
text(), val() 차이 및 input 값 설정 및 변경 (0) | 2022.09.22 |
---|---|
[JavaScript] onChange vs onKeyUp (0) | 2022.06.13 |
[JavaScript] Clipboard API (0) | 2022.06.07 |
[JavaScript] Web 개발을 위한 JavaScript (9) - Array 함수 + for문 차이 (0) | 2022.01.13 |
[JavaScript] 유용한 Array API 예제로 알아보기! (0) | 2022.01.10 |