본문 바로가기
반응형

전체 글39

javascript 노드 접근 방법 (노드 쿼리 메서드) 다음은 DOM 요소에 접근하는 다양한 방법에 대한 요약입니다 (참고: 요소 노드에 대해서만 쿼리할 수 있음). 아래의 쿼리 메서드 외에도 문서 객체에 대한 아래의 특수 프로퍼티로 문서의 일부를 선택합니다. document.body => 요소 노드를 선택합니다. document.head => 요소 노드를 선택합니다. document.documentElement => 요소 노드를 선택합니다. 쿼리 메서드 document.querySelector(); 모든 CSS 선택자(예: ' #id이름 ', ' .클래스명 ' 또는 ' div p.클래스명 ')를 사용하여 DOM에서 처음(!) 일치하는 요소를 반환합니다. 일치하는 요소를 찾을 수 없는 경우에는 null을 반환합니다. 추가 정보: https://develop.. 2023. 3. 15.
javascript 비교 연산자와 불리언(boolean) 조건문이나, 반복문 등의 조건부 코드실행에 자주 활용되는 비교 연산자에 대해 자세히 알아보겠습니다. 비교 연산자의 종류 비교 연산자의 결과는 True나 False인 불리언(Boolean) 자료형으로 출력됩니다. == (이중 등호 연산자) 두 값을 비교해서 참 또는 거짓으로 반환. 좌항, 우항의 값이 동등함을 확인 후 조건에 해당하는 코드만 실행. = (단일기호) - 변수나 상수에 값을 할당하는데 사용 != 값의 부등성을 확인하는 연산자입니다. a, b가 같지 않은 것을 확인 후 이 조건에 해당하는 코드만 실행. === (삼중 등호 연산자) 값과 자료형이 일치하는지 확인 비교합니다. !== 값과 자료형이 일치하지 않은 것을 확인 비교합니다. >, < 크기 비교 연산자입니다. 값이 큰지 작은지 비교하며, 숫.. 2023. 2. 28.
css 셀렉터 - 특성 선택자 [class *='text-'] 클래스 모두 선택하기 css선택자(css Selectors)는 아래와 같이 여러종류가 있습니다. 클래스 선택자 특성 선택자 ID 선택자 유형 선택자 전체 선택자 이 중 특성 선택자에 대해 알아보겠습니다. 특성 선택자란 주어진 특성을 가진 모든 요소를 선택하는 것을 말합니다. 특성 선택자 종류도 여러가지가 있는데요, class*='포함할 클래스' 이렇게 사용하면 내가 만든 class이름을 포함하고 있는 모든 태그를 선택할 수 있습니다. 클래스 이름을 포함한 모든 태그를 선택하는 방법에 대해 아래 소스로 예를 들어보겠습니다. '더보기' 라는 글자가 있고, 폰트사이즈와 여백값은 같고 색만 다르게 작업을 하였습니다. 더보기 더보기 더보기 더보기 더보기 font-size와 padding값이 똑같이 반복되고 있습니다. 반복해서 사용해도.. 2023. 2. 27.
VS Code 코드 자동줄바꿈 해제하기 소스 복사 후 prettier를 이용하여 자동 정렬을 하면 코드 모양이 예쁘게 나와서 좋을 때도 있지만, 자동정렬이 안되었으면 하는 코드도 전부 되어버려 불편할 때가 있습니다. CSS 한 줄 작성이나, 코드를 한 줄로 쓰고 싶어도 저장하기만 하면 자동 정렬이 되어버리거든요. prettier 옵션을 꺼도 자동정렬 해제가 되지 않는데, 이유는 VS Code 내에서 줄 바꿈 옵션 기능이 켜져 있기 때문입니다. VS Code에서 줄바꿈 옵션을 끄는 방법에 대해 자세히 알아보겠습니다. 저장할 때 자동 줄바꿈 끄기 (MAC) 1. Code > Preferences > Settings로 들어갑니다. settings의 단축키는 command + , 입니다. 윈도우의 경우 파일 > 기본설정 > 설정 에 들어가면 됩니다... 2023. 2. 2.
반응형