막내의 막무가내 프로그래밍 & 일상

https://sweetalert2.github.io/ SweetAlert2 A beautiful, responsive, customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes sweetalert2.github.io 웹에서 예쁜 Alert(알림, 알트) 창을 사용하여 웹개발을 했었다. (당연한거겠지만 기본 alert창 보다 백만배 디자인이 좋다.) 위 사이트에 들어가면 import하는 방법과 다양한 사용방법을 알 수 있다. 나도 밑과 두가지의 샘플 프로젝트를 만들어 보았다. 참고 하실분은 참고하시면 됩니다.! 댓글과 공감은 큰 힘이 됩니다. 감사합니다.!!

a태그 href값은 생략했습니다. ul 태그 ul_class 자식의 li태그 li_class 자식의 a태그의 class값을 알고싶다면 \ $(".ul_class").children("li .li_class).children("li .a_class").attr()

오늘은 DOM과 쿼리셀렉터에 대해 포스팅할려고한다. 만약 HTML이 구조란게 없이 막짜여지면 가독성도 떨어지고 여러모로 안좋을 것이다. 그래서 구조적인 모델로 짜기위해 DOM이라는 모델을 기준으로 한다. 1. DOM 브라우저에서는 HTML코드를 DOM(Document Object Model)이라는 객체형태의 모델로 저장합니다. 그렇게 저장된 정보를 DOM Tree라고 합니다. 결국 HTML element는 Tree 형태로 저장됩니다. 복잡한 DOM Tree를 탐색하기 위해 JavaScript로 탐색알고리즘을 구현하면 너무 힘듭니다. 그래서 브라우저에서는 DOM(document object model)이라는 개념을 통해서, 다양한 DOM API(함수 묶음정도)를 제공하고 있습니다. 브라우저는 DOM Tre..

CSS는 똑똑하게 동작하며 우선순위가 있다. 1. 첫번쨰 우선순위 먼저 크게 우선순위를 나누면 inline방식 < internal, external 이다. internal과 external은 뭐가 뒤에 오냐에 따라 우선순위가 그떄그떄 달라진다. (CSS는 기본적으로 만약 똑같은 내용이 있을 경우 뒤에 온 CSS스타일을 적용한다. 예를들어 이렇게 head태그사이에 internal방식과 그 뒤에 external방식이 있다고 치자. 물론 css.css에도 똑같이 internal 스타일처럼 div { color:blue; } 이렇게 되있는데 색만 blue라고 해보자. 그럼 external 방식이 internal방식보다 뒤에 선언되있으므로 external css가 적용되서 div태그사이의 색은 blue가 된다. ..