본문 바로가기

Frontend/jQuery11

[jQuery] .data() vs .attr() jQuery 공식 홈페이지에서 정의하는 .data() 와 .attr() 스펙 .data() : https://api.jquery.com/jQuery.data/#jQuery-data-element-key-value .attr() : https://api.jquery.com/attr/#attr-attributeName 공식 홈페이지에서 정의한 내용에 덧붙여 실무하면서 알게 된 사실을 적어보고자 한다 :) .data() .attr() 리턴 객체 데이터 타입 Object String DOM 변경 여부 X O 서로 다른 데이터 접근 X X 1. 리턴 객체 데이터 타입 .data() : Object 금액 계산을 하려면 typepf 로 현재 데이터 타입을 판단하고 parseInt 를 해야 한다. .attr() : S.. 2021. 6. 7.
[jQuery] jQuery 3.1 핵심 release note 포스팅 제목은 "jQuery 3.1 핵심 release note" 이지만, 3.1 에 국한되어있는 release note 가 아니라, 기존 프로젝트에서 jQuery1.8 을 썼어서.. 정확히는 1.8 에서 3.1 로 업그레이드 했을 때의 주요 변경사항이다 ^^;; 작성자 기준으로 뽑은거니까 다른 분들도 궁금하면 jQuery.com 들어가셔서 직접 Release Note 보는거 추천드립니다! 1. indexOf 의 표준화 -> https://github.com/jquery/jquery/commit/53aa87f3bf4284763405f3eb8affff296e55ba4f not present 는 ` -1` at index 는 `===N` 2. jQuery.Numeric() 의 .. 2020. 1. 15.
[Javascript/jQuery] 현재 페이지 URL 가져오기 자바스크립트로 현재 보고있는 페이지의 URL 을 가져와야 하는 경우가 생겼다. 그 URL 을 변수에 담아서 파싱해야하는데, 먼저 location.href 타입이 뭔지 확인해봤다. 그래서 string 잘 뽑혀와지는지 아래와 같이 확인해봤는데 .. var location = location.href; console.log(location); ㅋㅋㅋㅋ 아니 페이지가 계속 새로고침 되잖아 ??? -> document.url 로 해볼까 ??? -> 동일하네 ?? -> 구글링 해봤는데 별 얘기가 없네 ? 무한 고민하다가 결국 jQuery로 적용했다 ;; => $(location).attr('href') var location = $(location).attr('href'); console.log(location);.. 2019. 9. 9.
jQuery 로 특정 태그가 존재하는지 확인하는 방법 jQuery 로 특정 태그가 현재 보고 있는 페이지에 존재하는지 확인하는 방법 라는 태그가 페이지에 있는지는 아래와 같이 확인하면 된다 :D ... if ( $("#visible").length) { console.log("존재함"); } else { console.log("존재하지 않음"); } 2019. 5. 30.
자식요소 이벤트를 위해 부모요소 이벤트 막는 방법 자식요소 이벤트를 사용하기 위해 부모요소 이벤트를 막는 방법 이처럼 큰 네모박스(article) 을 클릭하면 '일정 상세보기' 페이지로 가게끔 jQuery를 걸어놨지만,큰 네모박스(article) 안에 'X버튼' 또는 '일정 수정하기' 또는 '게시물로 공유하기' 와 같이 자식요소를 클릭하면 그에 맞게 이벤트가 걸려야하는데,jQuery를 잘 잡아도 부모요소의 이벤트인 '일정 상세보기' 페이지로 넘어가더라.이에 대한 해결방법은, 자식요소에 e.stopPropagation(); 사용하기 ! * 사용방법 *1. HTML 내부1234567891011 일정 수정하기 게시물로 공유하기Colored by Color Scriptercs2. jQuery 부분123456789101112131415161718//일정 클릭시 .. 2018. 7. 25.
[jQuery/Bootstrap] 동적으로 생성한 요소에 tooltip 바인딩 시키기 단순하게 아래 코드 적용시켜주면 된다 :) $(document.body).tooltip({ selector: "[data-toggle='tooltip']" }); 출처 : https://code.i-harness.com/ko/q/97f5a9 2018. 7. 23.