생활코딩

Coding Everybody

코스 전체목록

닫기

배열과 반복문의 활용

소스코드

변경사항

 

댓글

댓글 본문
작성자
비밀번호
  1. 완료
  2. 굼벵이
    완료
  3. 박창신
    완료
  4. 감자
    완료
  5. Ted
    20191001 Ted 완료!
  6. 코딩만이 살길이다
    완료
  7. 쑤우
    수강완료. 감사합니다~
  8. 현우
    완료
  9. 정완료
    완료
  10. 두벅
    감사합니다.
  11. 한조
    감사합니다!
  12. JT_brand
    완료
  13. 한상윤
    완료
  14. 코딩가즈아
    감사합니다
  15. 최영오
    제 홈페이지를 1억명이 방문한다고 생각하면...어려워도 밤새야겠어요 진짜루
  16. eventme
    완료
  17. hyegineer
    완료!!
    queryselectorAll로 갖고오면 노드리스트 갖고오지만 배열과 비슷함 ㅎㅎㅎ
    재밌군...
    검색지향 프로그래밍이 인상깊었습니당
  18. Hyeon-Jun Ha
    완료
  19. 코돌이
    5/12 완료!
  20. 주워니
    완료!
  21. 이리스
    아래에 친절하게 설명해주신 분이 계신데요,
    조금 더 안내드리자면, F12를 누르셔서 console창에서
    document.querySelector('a') 를 입력해보시면 가장 위에있는 WEB를 표시해줄겁니다.
    결국 document.querySelector('a') 값만 본다면 가장 위에있는 WEB을 둘러싼 a태그만을 지정해주는 것이죠.
    반복문을 빼고 document.querySelector('a').style.color = 'powderblue'; 값을 넣어보면 WEB만 powderblue로 변하는 것을 볼 수 있습니다.

    그러면 이번에는 콘솔창에서 document.querySelector('body')를 입력해봅시다. 그럼 아마 모든 body태그 안의 모든 속성들이 잡혀있을겁니다. 그렇기에 document.querySelector('body').style.color = 'white'; 을 출력하면 body안의 모든 폰트색이 흰색으로 변하게 되는겁니다.

    추가로 document.querySelector('ol').style.color='powderblue' 을 하게되면 ol 태그안의 1,2,3번의 색상이 변경될겁니다. 고로 querySelector 함수가 지정해주는 위치의 차이인 것이죠.

    그렇다면 All을 붙이는 document.querySelectorAll('a').style.color = 'powderblue'; 은 왜 안되는지 콘솔창에
    document.querySelectorAll('a').style.color 을 입력해보시면 아실겁니다. 모든 태그들을 잡아주는 것이 아니라, 해당 태그들을 배열형태로 반환해주기 때문이죠. 고로 우리는 이 배열을 풀어서 적용시켜주어야하기에 반복문을 사용하는겁니다.
    대화보기
    • 윤혜인
      저도 같은 내용이 궁금하네요!
      대화보기
      • 위준우
        완료
      • 허공
        190509 감사합니다.
      • 최승윤
        완료!
      • 김한주
        완료
      • 끝가지간다
        완료~
      • Gimme_Gsuit
        querySelectorAll('a')은 html의 a태그를 js의 배열형태로 값을 가져옵니다. 그렇기 떄문에 js에서 가져온 배열형태의 a태그를 사용하려면 반복문을 주어서 []모든 배열에 속성을 적용해준다고 보면 될겁니다. ㅎㅎㅎ
        대화보기
        • Gimme_Gsuit
          js기준으로 학습하는 과정이기 떄문이지 않을까요?ㅎㅎ js로 html과 css를 활용할 수 있는? ㅎㅎ
          대화보기
          • 저도 이거 궁금했어요
            대화보기
            • 1억이란 숫자를 너무 좋아하는 스승님.....
            • 궁금한게 있는데 haed 부분에서 a 태그에 대한 css style 설정을 바꿔주지 않고 일일이 querySelectorAll()을 통해서 style을 지정해주는 이유가 무엇인가요??
            • 완료!
            • meanyMina
              저도 초보입니다만,,, document.querySelectorAll('a')는 4개의 a tag를 나열하고 있는 배열이라서 반복문을 사용해야 합니다. 전체 배열에 "powderblue"값을 지정하는 것이 아닌, 하나 하나의 a tag를 불러와서 색을 지정해야해서 그런 것 같아요. :)
              대화보기
              • 2019-02-19 완료
              • 우도순
                완료
              • 발헤
                감사합니다.완료
              • 호두
                감사합니다.
                제어문, 반복문의 개념은 알고있지만
                html에서 적용하는 방법에 대해 잘 몰랐는데

                강의를 보고 쉽게 이해할 수 있었습니다.
              • Juyeon Heo
                저도 같은 내용이 궁금했는데, 덕분에 해결됐습니다. 감사합니다 서주부님 :)
                대화보기
                • whynitz
                  감사합니다! 궁금한게 있는데

                  document.querySelector('a').style.color = 'powderblue';

                  이걸 추가하면 night 모드에서 자동으로 a tag 텍스트가 파우더블루로 바뀌지 않을까 했는데 안되네요.

                  document.querySelector('body').style.color = 'white';

                  이건 되고 a tag 는 안되는 이유가 뭔가요?
                • 지미츄
                  완료 감사합니다 ~!
                • 이수하
                  완료
                • gravity251
                  완료
                • Aimhee
                  완료
                • 한강
                  파우더 블루 색상이 이쁘네요. 감사합니다. ^^!
                • 돼지천재
                  감사합니다.
                • Pakupaku
                  겨우 다 실습을 해봤습니다;; 천천히 차근차근 생각하지 않으면 어지러워서 내가 지금 어디에 있는지 놓쳐버리네요. 그리고 세가지의 언어들이 뭉쳐서 ””요거와 ’’ 요거 구분하는거랑 자바의 대소문자 구분이 정말정말 어렵습니다; 익숙해지는건 끈기있게 하지 않으면 안되는군요;
                • 김상근
                  for loop version

                  for(i=0; i<alist.length; i++){
                  alist[i].style.color='powderblue';
                  }
                • Jung Ik
                  좋은 강의 고마워요 이고잉 님 ~
                • asdqwer123
                  감사합니다.
                버전 관리
                egoing
                현재 버전
                선택 버전
                graphittie 자세히 보기