생활코딩

Coding Everybody

코스 전체목록

닫기

조건문의 활용

조건문의 활용

소스코드

변경사항

댓글

댓글 본문
  1. 헤밍웨이
    220810_조건문의 힘
  2. 코드만다
    22.07.26
  3. RAHE
    2022.07.24_
  4. 진진리
    0711
  5. Dragonmin
    220710
  6. ~220708 완료. 한번 더 해보기
  7. toonfac
    220703 오후 6시 24분 완료
  8. 달수
    20220702 완료
  9. rhdwhdgu
    2022.06.27
  10. ichenny
    2022.06.26 복습 필요
  11. 양빵
    220613
  12. onehae
    220607
  13. 프렌치카페
    완전 꿀잼
  14. 탕탕
    220602
  15. 진진리
    22.05.19
  16. 220516
  17. 두릿두
    document.querySelector('#night_day').value = 'day'; 코드가 버튼을 day로 바꾸기 때문에

    if(document.querySelector('#night_day').value === 'night')을 부정하기 때문에 else 조건에

    해당하는 설정으로 변경하게 하는 역할 (else 조건으로)
  18. 고배배
    220424
  19. B_frog
    220407
  20. 220405
  21. 이윤
    220405
  22. DH니스
    2022.04.01
  23. 너구리기린
    2022.03.30
  24. html어렵
    220316
  25. new 개발자
    20220314
  26. 지구
    2022.03.14
  27. 2022.02.24 완료
  28. 드림보이
    2022.02.16. WEB2 - JavaScript - 조건문의 활용 파트 수강완료
  29. 무접점키보드
    2022.02.12
  30. aristia
    2022.02.03
  31. Aymon21
    2022-01-21 봤지만 또볼수 있음..
  32. 아까그애
    2022-01-21 완료
  33. 임앤강
    2022-01-20 완료.
  34. 열정jk
    220115 감사합니다
  35. 지원이아빠
    앞에분이 ol태그 얘기하신건 아마 CSS에서
    border-right:1px solid black;
    로 설정하신 부분 말씀하신것 같네요.

    다음과 같이 한줄씩 넣어서 해당 라인도 변경되게 할수 있을 것 같습니다.

    if(document.querySelector('#night_day').value === 'night'){
    document.querySelector('body').style.backgroundColor = 'black';
    document.querySelector('body').style.color = 'white';
    document.querySelector('ol').style.borderRight = '1px solid red'; /* 이부분 추가 */
    document.querySelector('#night_day').value = 'day';
    } else {
    document.querySelector('body').style.backgroundColor = 'white';
    document.querySelector('body').style.color = 'black';
    document.querySelector('ol').style.borderRight = '5px dotted green'; /* 이부분 추가 */
    document.querySelector('#night_day').value = 'night';
    }



    그리고 자바랑 CSS랑은 달라서, querySelectorAll('a') 로 선택을 하시면 안됩ㄴ비다.
    querySelectorAll('a')는 a태그가 달린 모든 걸 선택한다는게 아니고, 모든걸 배열로 가져온다는 뜻입니다.
    배열은 나중에 나오겠지만,
    쉽게말하면 querySelectorAll('a')[0] 이 첫번째 a태그, querySelectorAll('a')[1] 이 두번째 a태그... 이런식으로 지정이 되는거라, for문으로 처음부터 끝까지 돌면서 변경해줘야하는것 같아요.

    참고 : https://stackoverflow.com......nts
    대화보기
    • 저도 이 부분 궁금한데 해결하셨나요?
      document.querySelectorAll('a').style.color = 'white';
      로 시도해보았는데 css가 더 강력한지 바뀌질 않네요 ㅠㅜ
      대화보기
      • 이정결
        <!DOCTYPE html>
        <html>
        <head>
        <title> WEB1 - JavaScript</title>
        <meta charset="utf-8">
        </head>
        <body>
        <h1><a href="index.html">WEB</a></h1>
        <input id="night_day" type="button" value="night" onclick="
        if(document.querySelector('#night_day').value === 'night'){
        document.querySelector('body').style.backgroundColor = 'black';
        document.querySelector('body').style.color = 'white';
        document.querySelector('#night_day').value = 'day';
        } else {
        document.querySelector('body').style.backgroundColor = 'white';
        document.querySelector('body').style.color = 'black';
        document.querySelector('#night_day').value = 'night';
        }
        ">
        <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>
        <h2>JavaScript</h2>
        <p>
        JavaScript (/ˈdʒɑːvəˌskrɪpt/[6]), often abbreviated as JS, is a high-level, dynamic, weakly typed, prototype-based, multi-paradigm, and interpreted programming language. Alongside HTML and CSS, JavaScript is one of the three core technologies of World Wide Web content production. It is used to make webpages interactive and provide online programs, including video games. The majority of websites employ it, and all modern web browsers support it without the need for plug-ins by means of a built-in JavaScript engine. Each of the many JavaScript engines represent a different implementation of JavaScript, all based on the ECMAScript specification, with some engines not supporting the spec fully, and with many engines supporting additional features beyond ECMA.
        </p>
      • 이거왤케어려워
        211230 완료 감사합니다.
      • commonerd
        2021-12-23
        <input id="night_day" type="button" value="night" onclick="
        if(document.querySelector('#night_day').value === 'night'){
        document.querySelector('body').style.backgroundColor = 'black';
        document.querySelector('body').style.color = 'white';
        document.querySelector('#night_day').value = 'day';
        } else {
        document.querySelector('body').style.backgroundColor = 'white';
        document.querySelector('body').style.color = 'black';
        document.querySelector('#night_day').value = 'night';
        }
        ">
      • 소설가
        2021-12-16 완료
        고맙습니다.
      • 완료
      • 롤링
        오후 1:57 2021-12-14
      • 민택기
        21.12.04 완료
      • survive
        21.11.22
      • 개발맨
        완료
      • 21-10-29. 7타.
      • 21-10-28. 6타.
      • 21-10-27. 5타.
      • 21-10-26. 4타.
      • 21-10-20. 3타.
      버전 관리
      egoing
      현재 버전
      선택 버전
      graphittie 자세히 보기