WEB2 - JavaScript

배열과 반복문의 활용

소스코드

변경사항

 

댓글

댓글 본문
작성자
비밀번호
  1. 끝가지간다
    완료~
  2. Gimme_Gsuit
    querySelectorAll('a')은 html의 a태그를 js의 배열형태로 값을 가져옵니다. 그렇기 떄문에 js에서 가져온 배열형태의 a태그를 사용하려면 반복문을 주어서 []모든 배열에 속성을 적용해준다고 보면 될겁니다. ㅎㅎㅎ
    대화보기
    • Gimme_Gsuit
      js기준으로 학습하는 과정이기 떄문이지 않을까요?ㅎㅎ js로 html과 css를 활용할 수 있는? ㅎㅎ
      대화보기
      • Jina
        저도 이거 궁금했어요
        대화보기
        • grace
          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
              감사합니다.
            • raiN.Shower
              7:10쯤 console창에
              var alist=document.querySelectorAll('a');
              var i=0;
              while(i<alist.length){
              console.log(alist[i]);
              alist[i].style.color='powderblue';
              i=i+1;
              }
              말고
              var alist=document.querySelectorAll('a');
              var i=0;
              while(i<alist.length){
              alist[i].style.color='powderblue';
              i=i+1;
              }
              넣어도 상관없지요?

              아 조금뒤에 필요없다고 언급하고 지우셨네요 ^^;;확인했습니다~~
            • 풀등
              평소에 문서로만 공부해서 개념이 확실하지 않았는데, egoing 선생님의 강의를 들으니 어려워서 싫어진 부분들이 쉽고, 가깝고, 힘있게 다가옵니다. 감사합니다.^^
            • 서주부
              querySelectorAll ('a') 로 나오는 결과는 a 들의 리스트이기 때문이래요.. 그니까 옷(a)들이 들어있는 서랍(a 들의 리스트) 에 색깔을 입힌다고 옷들의 색깔이 변하는게 아닌것처럼요~~ 그래서 하나 하나 꺼내서 색을 바꿔줘야하는데 이때 하나 하나 다 쓸수 없으니까 반복문을 쓰고요
              대화보기
              • Tae Ha Ahn
                ctrl + L 로 바뀐것 같아요~ 한번에 지우기~
                대화보기
                • NGiveup
                  너무 잘 듣고 있습니다. 감사합니다!!
                • a태그에 꼭 반복문만 사용해야 하는건가요?

                  반복문을 사용하지 않고

                  if값
                  this.value = 'day'; 밑에

                  document.querySelectorAll('a').style.color='powderblue'; 를 넣는건 왜 안되는 건가요?
                • 짜잔! 하실때마다 뭔가 기대가 잔뜩 되네요 ㅋㅋㅋㅋ
                  일억명이 찾는 사이트를 만드는 준비중입니다:D
                  감사합니다!!
                • gotogoogle_webengineer
                  body태그(화면 상단의 큰 WEB)와 div 태그(ol 1~3까지의 a태그)로 묶인 a태그를 동시에 가져오려면 어떻게 해야하나요?
                  document.querySelectorAll('body #grid a'); 이런식으로 해봤는데 ol에만 적용되고 body태그에는 적용이 안되네요..
                • metallsk
                  have a welly good time~!!
                • 로버트한
                  감사합니다.ㅣ ^^
                • 저는 크롬에서 console 창에서 코드를 쓰다가 알려주신 단축키 Ctrl + k를 누르면 구글 검색창이 활성화되네요!?


                  반복문을 활용한 부분 동영상을 보면서 하나하나 따라할 수도 있고 재미있기도 했는데요~
                  막상 저걸 혼자해 보라고 하면 못해요.. 다 잊어버리는 것 같아요ㅠ.ㅠ
                  저만 이러는걸까요ㅜㅜㅜ
                  대화보기
                  • 코알못
                    코드도 다썻고 왜 작동이 안될까요..ㅠㅠ 아톰쓰고있어요 ㅠㅠ
                  • NightFox
                    style.color=' '; 이렇게 공백을 넣어주시면 디폴트로 복구가 되네요
                    원래 지정된 css값으로는 그냥 style.css에 있는 값으로 넣어주시면 될 것 같습니다.
                    대화보기
                    • 오싹
                      소오오오름!!
                    • 스페이스몽키
                      이번 강의도 정말 감사합니다! 매번 똑같은 내용으로 글 남기는거 같지만 강의 들을 떄마다 너무 좋네요
                    • jayxwoo
                      반복문, 배열, 변수를 실제로 적용해보니 더 재미있네요. 수업 잘 들었습니다.
                    • noName
                      2018-5-10 완료
                    • 키썬
                      네.. 답변감사합니다^^
                      대화보기
                      • firebird
                        배열이 첫번째가 0이기 때문이에요.(첫번째 요소를 가지고 오기 위함) 음 그리고 대부분의 프로그래밍의 숫자 시작은 0입니다. 이유는 글쎼요?; 2진수가 01 이런식으로 시작하기 때문일까요?;
                        대화보기
                        • 키썬
                          궁금한게 있는데요 전 수업에서 들었던거 같긴한데 까먹은건지 이해가 안되는건지..
                          ------------------------
                          var alist = document.querySelectorAll('a');
                          console.log(alist[0]);
                          ------------------------
                          a태그 리스트중 원하는 리스트 순서를 콘솔로그에 가져오라고 명령할때
                          a list [숫자]가 1번째 a태그를 가져올때 왜 숫자 0을 넣는건가요?
                          자바스크립트에서만 숫자0이 소스상의 모든 첫번째를 의미하는 건가요?
                        • 키썬
                          F12 눌러서 개발자 모드 실행 후 elemets클릭한 상태에서 esc 누르면되여
                          대화보기
                          • daaawnstar
                            힘들지만 보람을 느껴요 ~!
                          • Smith Jang
                            저는 검사로 할때는 적용되는데 왜 아톰에 하면 실행이 안될까요 코드 오류도 없습니다 ㅠㅠ
                          • egoing
                            생활코딩 페이스북 그룹과
                            생활코딩 페이스북 페이지가 있습니다.
                            검색해보셔요~
                            대화보기
                            • 꺄울
                              항상 감사합니다... 처음부터 지금까지 들으면서 정말 많은 공부가 되었어요
                              혹시 페이스북이나 다른 sns계정으로 이러한 코딩에 관련된 그룹이 있나요??
                              모르는것에 대해 질문도 해보고 공부도 더 해보고 싶어요
                            • egoing
                              검색어 추천 드릴게요~
                              https://www.google.co.kr......F-8
                              대화보기
                              버전 관리
                              egoing
                              현재 버전
                              선택 버전
                              graphittie 자세히 보기