지식을 훔쳐라 ❕ 👀 지식을 훔쳐라 ❕ 👀

분류 전체보기

• [FE] DOM

  FrontEnd 2022. 4. 24. 02:56

  DOM(Document Object Model)이란? HTML, XML 문서의 프로그래밍 interface 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공 → 문서 구조, 스타일, 내용 등을 변경 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결 웹 페이지의 객체 지향 표현이며, 자바스크립트와 같은 스크립트 언어를 이용해 DOM 수정 (무슨 말인지 모르겠다. 블로그를 통해 다시 한 번 알아보자!) 문서 객체(Document Object) : Javascript가 이용할 수 있는 객체(HTML 태그) DOM은 넓은 의미로 웹 브라우저가 HTML 문서를 인식하는 방법을 의미 좁은 의미로는 document와 관련된 객체의 집합 HTML DOM (트리형 구조) See the Pe..

  Read More
• [FE] 공부하면서 이것 저것.. 지식 모으기

  FrontEnd 2022. 4. 24. 02:36

  웹 페이지 CSS 제거 console 창에 document.head.parentNode.removeChild(document.head); 웹 페이지 이미지 다운 sources에서 이미지 다운로드 가능 이모지 사용 방법 https://jakehollys.tistory.com/34

  Read More
• [FE] 도움되는 git, velog, 기타 사이트

  FrontEnd 2022. 4. 24. 02:35

  취준생이 반드시 알아야 할 프론트엔드 지식들 https://github.com/baeharam/Must-Know-About-Frontend.git TypeScript https://typescript-kr.github.io/ JavaScript https://ko.javascript.info/

  Read More
• [JS] 선택자 종류

  FrontEnd/JavaScript 2022. 4. 24. 02:35

  getElementBtId : 고유한 ID로 선택 getElementsByClassName : 같은 이름의 클래스 모두 선택 (배열) getElementsByTagName : 같은 태그(ex. h1, button ...) 모두 선택 (배열) querySelector : 한 개의 요소만 선택 (CSS 선택자로 선택) querySelectorAll : 복수 선택 가능 (CSS 선택자로 선택) ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ querySelector와 getElement의 차이는 속도...? getElement가 1.2배 정도 빠르다고 한다. 그렇지만 선택의 자유도는 querySelector가 더 큰 듯 하다. 생각해보면 웹 서핑을 할 때 1, 2초만 ..

  Read More
• [JS] 좋아요, 싫어요 버튼

  FrontEnd/JavaScript 2022. 4. 24. 02:33

  function clickLikeBtn() { if (likeBtn.classList.contains('active')) { likeBtn.classList.remove('active'); like_sign = 0; } else { if (unlike_sign == 1) alert("이미 싫어요를 눌렀습니다."); else { likeBtn.classList.add('active'); like_sign = 1; } } } function clickUnlikeBtn() { console.log('unlikebtn') if (unlikeBtn.classList.contains('active')) { unlikeBtn.classList.remove('active'); unlike_sign = 0; } else..

  Read More
• [HTML, CSS] 알게 된 개념들

  FrontEnd/HTML／CSS 2022. 4. 24. 02:30

  font awesome 아이콘 사용을 위한 태그 google font 사용을 위한 태그 video 속성 controls : 동영상을 제어할 수 있는 controller가 만들어짐 autoplay : 웹 페이지가 open 되었을 때 자동으로 동영상 Play video 크기를 반응형으로 제어하고 싶을 경우 : % 이용 width, height : 100%를 주면 가로세로 비율은 달라지지 않은 상태로 전체 width를 먹는 것을 볼 수 있음 만약 화면이 매우 클 때 width 크기를 제한하고 싶을 경우 max-width 속성을 이용 width의 크기가 바뀌어도 제목이 3줄 이상 되지 않도록 하는 속성 -webkit-line-clamp -webkit-line-clamp CSS 속성은 블록 컨테이너의 콘텐츠를 지..

  Read More