프론트 엔드/java script TIL

5월5일 TIL (js로 css 수정하기)

khw7876 2022. 5. 8. 03:19

Document.getElementById() 메서드는 주어진 문자열과 일치하는 id 속성을 가진 요소를 찾고, 이를 나타내는 Element 객체를 반환합니다. ID는 문서 내에서 유일해야 하기 때문에 특정 요소를 빠르게 찾을 때 유용합니다.

 

비슷한 속성으로 css를 가져오는 타입으로는

 

ID가 없는 요소에 접근하려면 Document.querySlector()를 사용하세요. 모든 선택자 (en-US)를 사용할 수 있습니다.

해당 아이디의

 

 

.createElement( 'h1' )

html요소에 ()를 생성합니다.

 

 

bg.setStyle({
    position: 'fixed',
    zIndex: zIndex,
    left: '0px',
    top: '0px',
    width: '100%',
    height: '100%',
    overflow: 'auto',
    // 레이어 색갈은 여기서 바꾸면 됨
    backgroundColor: 'rgba(0,0,0,0.4)'
});

bg라는 변수의 css를 지정합니다.

 

document.body.append(bg);

html body요소에 bg라는 변수를 추가합니다.

 

 

document.querySelector('선택자').style.display = 'inline-block';

querySelector 를 사용하여 css속성을 바꾸는 내용이다. 여기서는 display를 바꾸어 보았다!