✨ 해당 답변은 취준생의 입장에서
검색하고 찾은 답변이니 혹시라도
답이 잘못되어 있는 경우 말씀해 주시면
수정하겠습니다 ✨
장점
1. 개발의 효율성이 높아짐 - 소스의 동일화, 수정 및 운영관리 용이
2. 접근성이 향상됨.
3. 논리적인 코드로 코드양이 줄어들어서 서버에 부담이 감소됨.
장점
1. 검색엔진이 HTML을 분석할 때 정확하게 컨텐츠를 식별할 수 있음.
2. 접근성의 측면에서, 의미를 더 잘 파악할 수 있음
3. div
, span
의 요소보다 가독성이 높다.
<!DOCTYPE html>
웹 브라우저가 처리할 문서가 HTML이라는 뜻 <a>
, <button>
, <input>
<a>
페이지 링크 걸 때 문서간의 URL 연결 <button>
사용자 인터페이스만을 조작하기 위해 사용 <input>
사용자 입력을 서버로 전송하기 위한 버튼 <del>
, <ins>
<del>
취소선<ins>
밑줄<section>
과 <article>
의 차이<section>
은 논리적으로 관계있는 문서 혹은 요소를 뜻한다. <article>
은 독립적인 콘텐츠https://www.koreahtml5.kr/front/stats/browser/browserUseStats.do
height
부여height
변경 시 부모도 변경해야 함.overflow: hidden
부여clear: both
사용 <figure>
:hover
, :active
등장점
1. 한번에 로드 되어 이미지 깜빡임 현상이 없다. (서버에 이미지 요청 횟수가 한번)
2. 컴포넌트화 기능
단점
1. background-position
을 활용하여 직접 위치를 찾아야 하는 번거로움
block
엘리먼트의 한해서 발생하는 현상으로 좌우 방향으로는 적용되지 않고 수직방향으로 적용됨 . 2개의 마진 중 더 큰 마진으로 덮어 씌우는 방식임position: absolute
, float: left
, display: flex
등 다양한 상황에서 마진겹침이 발생하지 않음.input
은 스크린리더에는 읽히지만 화면에는 보이지 않도록 CSS로 스타일 처리 후, label
에 스타일링 처리.script
, script async
, script defer
script
<header>
태그에 있을 때script async
script defer
script
를 <body>
태그 직전에 삽입하는거와 동작은 같지만 브라우저 호환성의 문제로 현재는 <body>
태그 직전에 삽입하는 것을 권장.구성요소
1. URL
2. HTTP Method (GET, POST, DELETE, PUT)
3. JSON
장점
1. 동적으로 엘리먼트를 추가할 때 마다 핸들러를 고려할 필요 없음
2. 상위 엘리먼트에 하나의 이벤트 핸들러만 추가하면 되어서 코드가 깔끔해짐
3. 메모리에 있게 되는 핸들러가 적어지기 때문에 퍼포먼스 측면에서 이점이 있다.
undefined
true
혹은 false
로 나타냄. 실제적인 상태, 활성화, 체크여부, 선택여부등을 알 때 좋음 예시
<input type="checkbox"/>
console.log($('input').attr('checked'))
// undefined
console.log($('input').prop('checked'))
// false
undefined
를 갖게됨 → 이럴때는 prop()이 나음.siblings()
parent()
children()
offset()