본문 바로가기

Front-End/HTML , CSS3

this, $(this) 의 차이 this는 자바스크립트의 문법, $(this) 는 JQuery의 문법으로 명칭은 비슷해 보인다. 그러나 다른 데이터를 보여주는데... 사실 비교적 간단하다.. filterSelect.on("change", function(e) { console.log(this); console.log($(this)); }) 개발자 도구를 살펴보면 추출되는 데이터가 다른것을 알 수 있는데. this의 경우 해당 이벤트가 발생한 요소를 표시해주고 $(this)는 이벤트가 발생하면 발생한 태그를 Object 형태로 감싸서 보여준다는게 다른점이다. this와 같은 데이터를 갖기 위해서는 $(this)[0] 을 사용하면 된다. this === $(this)[0] 2021. 3. 22.
<select>태그의 option의 value 값 // 추가 작성내용 굳이 this를 사용하지 않고 다른 방법으로도 value을 얻어왔다.. 만약 select태그를 div부모로 감싸고 있다고 가정하면 2021. 3. 22.
display: table , table-cell 프로젝트 제작 겸 특정 사이트를 모방해서 따라만들면서 연습하는 도중에 발견한 CSS이다.. * 특정 사이트에서 만들어져 있는 화면. 클론코딩 중에 위의 표를 만드려고 했을 때 우선 간단하게 따라서만드는 것에 의미를 두고 있기 떄문에 우선적으로 기억난 것은 display: flex 를 이용해서 해당 div박스의 레이아웃을 잡으려고 했다. 그렇지만 개발자도구를 통해 확인해본 결과 display: table이라는 속성을 사용하고 있었다. display: table 속성을 사용하기 위해서는 다음과 같은 방법으로 진행해야한다. 1. 부모 태그가 display: table 을 사용한다. 2. 자식 태그가 display: table-cell 을 사용한다. * 굳이 이 아니라 해당 CSS를 사용하는 이유는 vertic.. 2021. 3. 19.