카테고리 없음

스테이지어스 4주차 정리(2)

jjon-jonny 2024. 4. 10. 14:09

queryselector vs getElementbyid  다른점은??

 

queryselector 가 더 구체적인 위치를 요구함

 

그런데 getElementbyid 를 현업에서 더 많이 쓰는듯함. 

 

js로 html css 변경하기

 

js로 구구단 만들기

==> 

값 가져오기

var value=parseint(document.getElementid="~~".value)

p 생성해서 출력해주기

for(var i=1;i<=9;i++)

{

result=value * i;

var tmptag=document.createElement("p")

tmptag.innerHTML=result;

document.getElementid("~~").appendchild(tmptag);

}

 

drag event 를 알아보자!!

 

function getcolorevent(e){

    var target=e.target;

    bgcolor=window.getcomputedstyle(target).backgroundcolor

    

}

그냥 바로 스타일 써서는 못가져온다

 

왜일까??

 

 

getElementid vs getComputedStyle()  의 차이를 알아보자

일단 먼저 전자는 style 값을 못가져오고 후자는 가져올 수 있다!

 

이유는 일단 전자는 html 문서 안에서 직접 가져오는 거다

근데 인라인 방식이라면 문제가 없는데 보통은 href 를 써서 밖에서 만들어 놓기 때문에 빈 데이터를 가져가게 되는 것이다.

 

후자는 최종적으로 적용된 모든 css 속성 값을 담은 객체를 반환하게 된다!!

 

그러면 여기서 getElementid는 getcomputedstyle의 하위호환인가 라고 생각하며 안써야지 라고 생각해도 될까??

 

===> 아니다!!!

 

getcomputedstyle은 읽기 전용이다!!! 

 

읽기 전용이라 값의 변경이 안된다!!

 

브라우저와 preventdefault 찾아보기!!!

 

==>브라우저의 기본으로 깔려 있는 것들이 많기 때문에 그것들을 이 이벤트 동안에 잠깐 중지 시켜달라고 말하는 것

 

이 방법 말고 하나 더있긴 한데

onevent 에서 return 값을 false 로 하는 것 도 있다고 한다

그런데 오직 onevent 에서만 가능하다고 한다

원래는 return 값을 무시한다고 함