<javascript> 문서객체의 선택

javascript에서 변수는 데이터를 저장할 수 있는 공간이다.

변수를 선언하기 위한 선언문으로 var, let, const의 선언문을 사용한다.

var a

let b

const c

var : 동일한 변수명으로 재선언, 재정의가 가능
let : 동일한 변수명으로 재선언불가/선언 후 변수명으로만 재정의 가능
- { },( ), 함수 안에서 선언 시 지역변수로 정의/지역변수와 전역변수의 구분 필요
const : 동일한 변수명으로 재선언, 재정의 불가/선언문을 빼고 변수명으로도 재정의 불가
- javascript 사용 시 선택자의 선택 노드가 길어서 선택자를 저장하여 활용하게 됨

◆ 스타일의 적용

- CSS, j-query 의 경우 내 문서 전체에 있는 동일한 스타일명에 동일한 스타일이 적용된다.

- javascript의 경우 선택한 선택자에게만 스타일이 적용된다.
이 때 선택자의 경우 직접 선택하는 방식보단 변수를 활용한다.

◆다음은 같은 스타일을 적용하기 위해 CSS/j-query/javascript 각 작성한 코드이다.

width, height, backgroundcolor값만 이용하여 표현하고 싶었으나 보기 편하게 하기 위해 부가적인 요소로 text-align, line-height, border, box-sizing등의 값이 추가하여 작성하였다.

💡자바스크립트의 경우 선택한 선택자에게만 스타일이 적용되게 됨에 따라 나는 for문을 이용하게 되었는데 이 방법을 통한 스타일 설정이 최선일까란 의문이 생겼다

속닥속닥 코Ding