소스코드
댓글
-
분명히 야간 모드에서 잘 작동해서 코드 복사해서 else 뒤에 있는 주간 모드에 붙여 넣기해서 색깔만 바꿔서 브라우저에서 해보니 주간/야간 모드가 작동하질 않았다. 한 5분 정도 헤매다가 발견한 문제의 원인은 바로 코드를 복사할 때 닫는 중괄호( } )까지 복사하지 않아서 작동하질 않았던 거였다. 하하하. -
220424
-
220406
-
220405
-
2022.04.03
-
2022.03.30
-
버튼을 위 아래 두개 만들어 놓고
코드는 아래꺼만 수정함
그래놓고 위쪽 버튼 계속 눌러도 안바껴서 눈빠지게 찾았는데
알고 보니 아래쪽 버튼 정상 작동...ㅋㅋㅋㅋㅋㅋ -
2022.03.15 재수강 필수
-
20220315
-
저도 궁금해서 구글링 해봤는데 이렇게 나오네요! 참고하시면 될 것 같아요!!
The NodeList object returned by the querySelectorAll() method must be static, not live ([DOM-LEVEL-3-CORE], section 1.1.1). Subsequent changes to the structure of the underlying document must not be reflected in the NodeList object. This means that the object will instead contain a list of matching Element nodes that were in the document at the time the list was created. -
2022.02.24 완료
-
단순히 배열과 반복문을 사용하지 않고 버튼에 document.querySelectorAll('a').style.color = 'powderblue'; 를 추가하면 되지 않을까 생각했는데 안되더군요...
document.querySelector('a').style.color = 'powderblue'를 할 경우에는 첫번째 태그에만 적용이 되었는데, querySelectorAll('a')은 왜 안되는지 알 수 있을까요? 콘솔을 통해서 보아도 문제의 원인을 모르겠네요
단순히 링크색상을 바꾸려면 document.linkColor = 'red';을 쓰면 되지만
querySelectorAll의 명령은 왜 안되었는지 궁금합니다. -
2022.02.17. WEB2 - JavaScript - 배열과 반복문의 활용 파트 수강완료 -
2022.02.13
-
와,, 존경합니다 리팩토링을 어떻게 해야할지 고민했는데 와,,,
-
2022-02-10 완료
-
2022.02.04
-
20220126
-
2022-01-22 감사합니다 ~~
-
2022-01-21 완료
-
22.10.20 감사합니다!
-
220117 감사합니다
-
이번회에서 배운 배열을 이용해보면 좀더 쉬울것 같습니다.
<input id="night_day" type="button" value="night" onclick="
// 변수는 if/else문 앞에 미리 지정합니다.
var target = document.querySelector('body');
var alist = document.querySelectorAll('a');
var i = 0;
// if/else문에서는 변수에 배경색,글자색,버튼내용,링크색을 지정합니다.
if(this.value === 'night'){
// 배경색,글자색,버튼내용,링크색
var pageStyle = ['black', 'white', 'day', 'powderblue'];
} else {
// 배경색,글자색,버튼내용,링크색
var pageStyle = ['white', 'black', 'night', 'blue'];
}
// if/else문 밖에서 변수값으로 실제 스타일을 지정합니다.
target.style.backgroundColor = pageStyle[0];
target.style.color = pageStyle[1];
this.value = pageStyle[2];
while(i < alist.length){
alist[i].style.color = pageStyle[3];
i = i + 1;
}
"> -
질문의 의도와 다른 답인것 같아 내용 추가해봅니다.
alist를 else문에도 또 선언하는 이유가 있느냐 는게 요지인데 아래 문장이 if문에도 있는데 else문에도 있어서 그런거죠.
var alist = document.querySelectorAll('a');
이 자바스크립트 코드는 메모리에 상주해 있는게 아닙니다.
참고 : https://developer.mozilla.org......ent
사용자가 버튼을 클릭할때 onclick= 에 있는 내용이 실행되죠. 그래서 if 또는 else 에 맞는 구문이 실행되고 나면 변수는 전부 없어집니다. 다음번 클릭때 다시 생성되는거죠.
코드를 단순하게 하기 위해서는 중복되는 부분을 if/else 문 밖으로 빼면 됩니다.
<input id="night_day" type="button" value="night" onclick="
var target = document.querySelector('body');
var alist = document.querySelectorAll('a'); // 이부분을 if/else문 앞으로 뺐습니다.
var i = 0; // 이부분을 if/else문 앞으로 뺐습니다.
if(this.value === 'night'){
target.style.backgroundColor = 'black';
target.style.color = 'white';
this.value = 'day';
while(i < alist.length){
alist[i].style.color = 'powderblue';
i = i + 1;
}
} else {
target.style.backgroundColor = 'white';
target.style.color = 'black';
this.value = 'night';
while(i < alist.length){
alist[i].style.color = 'blue';
i = i + 1;
}
}
"> -
220103 완료 감사합니다.
-
21.12.28 완료
-
2021-12-23
<h1><a href="index.html">WEB</a></h1>
<input id="night_day" type="button" value="night" onclick="
var target = document.querySelector('body');
if(this.value === 'night'){
target.style.backgroundColor = 'black';
target.style.color = 'white';
this.value = 'day';
var alist = document.querySelectorAll('a');
var i = 0;
while(i < alist.length){
alist[i].style.color = 'powderblue';
i = i + 1;
}
} else {
target.style.backgroundColor = 'white';
target.style.color = 'black';
this.value = 'night';
var alist = document.querySelectorAll('a');
var i = 0;
while(i < alist.length){
alist[i].style.color = 'blue';
i = i + 1;
}
}
">
<ol>
<li><a href="1.html">HTML</a></li>
<li><a href="2.html">CSS</a></li>
<li><a href="3.html">JavaScript</a></li>
</ol> -
2021-12-19 완료
고맙습니다. -
완료...계속 정주행
-
오후 2:31 2021-12-14
-
21.12.5 완료
-
21.11.23
-
감사합니다.
-
완료
-
21-10-30. 3타.
-
21-10-28. 2타.
-
21-10-27. 1타.
-
21.10.20 감사!
-
여기에서는 색을 다시 blue로 바꾸기위해서 else문에도 선언을 해준거에요.
else문에 따로 alist blue컬러를 선언해주지 않는다면 한번 실행된 if문에서의 powederblue컬러가 변하지 않거든요.
night에서 day로 변했을때 powderblue에서 color색상을 변화시키지 않을거라면 if문에만 선언해주면 됩니다. -
21년 10월 19일
-
좀 헷갈려졌지만 굳
-
2021/10/08 -
211006
-
if 문에서 선언했던 alist를 else문에서도 선언하는 이유는 뭔가요? var로 선언하면 전역변수라서 else에서도 접근 가능한 것 아닌가용?? 따로 선언 안하면 색깔이 안바뀌긴 하는데.. -
감사합니다!
-
2021.09.28
-
2021.09.25. -
2021.08.25 수강 완료! 이렇게 JS가 재밌는데 왜 진작 안 들었을까 싶네요 ㅎㅁㅎ -
2021.08.13 수강완료
-
'검색지향프로그래밍'
버전 관리
| egoing |
| 현재 버전 | |
|---|---|
| 선택 버전 |
