inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

[그랩마켓] Javascript 적용하기 - 2

질문드립니다

해결된 질문

304

Terry

작성한 질문수 14

3

1. 먼저 강의를 보고 따라 작성한 코드이지만 중간부터 브라우저에 상품이 나타나지 않아서 어느 부분을 고쳐야 하는지 알고 싶습니다.

2. querySelector은 productsHtml을 받게되면 이 안에 저장된 값들을 하나하나 보여주는 도구?인걸까요?

3. products에서 상품에 대한 정보를 하나하나 받아와 반복문으로 넣었을 때  productsHtml은 배열의 형태로 각 정보를 저장하는건가요?

tensorflow 머신러닝 배워볼래요? javascript nodejs react-native react express HTML/CSS

답변 3

3

들샘님

1. 첨부된 사진의 코드의 5번째 줄에, produtcs 라고 오타가 났습니다! products라고 고쳐주시면 될 것 같아요!

2. querySelector는, css를 조작할 대상을 선택해주는 도구입니다! #products-list를 가진 태그를 선택해준거고, .innerHTML 속성으로 #products-list 를 가진 태그의 내용을 productsHtml 로 바꾸어 준 것입니다.

3. 배열의 형태로 각 정보가 저장되는것이 아니라, #product-card들이 여러개 모인 HTML 태그의 모임이 되는것입니다!

아직 배워가는 단계라 답변이 완벽하지 않을 수 있습니다.. 이해 안가시면 다시 물어봐주세요 :)

2

그랩

들샘님이 소개를 잘 해주셨네요. 감사합니다.

2번 querySelector는 id, class 등 선택자를 이용해서 HTML 요소(태그)를 선택하도록 돕는 역할을 합니다. 그리고 선택된 태그를 가공하는 작업을 뒤에서 할 수 있게 됩니다. 
[참고] https://www.codingfactory.net/10410

3번 같은 경우 어떤 데이터를 담고있는지 확인하려면, for 루프 {} 맨 아래에 console.log(productsHtml)을 넣어보면 어떤 데이터들이 쌓이는지 확인할 수 있습니다. 반복문을 돌아가면 string 형태의 데이터가 계속해서 더해지는 구조임을 확인하실 수 있을 거예요

1

Terry

들샘님과 그랩님 모두 친절한 답변 감사드립니다. 눈이 빠지게 찾아봤는데도 못 찾았던 오타인데 역시 다른 사람이 보면 나오는군요...^__ㅠ 2번과 3번 같은 경우 또한 첨부해주신 링크 통해서 제가 더 공부해보겠습니다. :)

[해결]그랩님 답변 주세요.

0

160

2

그랩님의 답변을 기다립니다/102강 전반적인 에러

0

140

2

[그랩님께]101강 안드로이드 에러들(Key prop)해결방법 궁금합니다.

0

122

2

[재질문][그랩님 답변 부탁드립니다]101강

0

135

2

[그랩님 답변 부탁드립니다]101강 Axios 에러와 502 Bad Gateway 질문

0

96

2

Ngrok 설치 후 forwarding Url 에러

0

129

2

[그랩님께,Ngrok 악성코드 인식 해결방법]질문 드립니다.

0

215

2

Ngrok 설치 후 forwarding Url로 연결 불가

0

133

1

그랩님,[꼭] 답변 부탁드립니다.

0

64

1

[꼭][[꼭] 그랩님, 답변 부탁드립니다], Failed to load resource: the server responded with a status of 404 (Not Found) 상품 상세 페이지 질문입니다.

0

148

1

6강/7강 수업

0

49

1

그랩님, 상품 상세 페이지 에러와 의문점 질문드립니다.

0

98

2

그랩님, 해결되지 않은 에러 메시지 [꼭] 답변 부탁 드립니다.

0

133

2

[재 질문]Cannot read properties of undefined (reading 'map') TypeError: Cannot read properties of undefined (reading 'map') 에러 해결 어떻게 하나요?

0

88

1

Cannot read properties of undefined (reading 'map') TypeError: Cannot read properties of undefined (reading 'map') 에러 해결 어떻게 하나요?

0

126

2

일반적인 css 꾸미기에서 width와 height의 값?

0

87

2

Windows에서의 업로드 후 홈화면 상품이미지 오류 해결방법

0

191

1

그랩마켓 웹화면 구현하기 -2 질문입니다.

0

118

1

react에 반영이 되지 않습니다.

0

234

1

터미널 npm install -g create-react-app 작성 후 오류

0

418

1

create-react-app my app 실행 시 에러

0

351

2

포스트맨 질문

0

97

1

<꼭 답변 부탁 드립니다>그랩선생님, [컴포넌트 사용하기] 강의에서 질문 있습니다.

0

258

2

그랩선생님, 질문 답변 부탁 드립니다.vscode에서 npm install -g create-react-app 입력 후 에러 입니다.

0

472

2