웹개발 일지 (2) - Javascript, JQUERY

#

Javascript 복습 

 

*자주 하기 쉬운 실수 

let count = 1; 을 앞에 넣어버리면, count +=1; 로 카운트 업을 시키더라도 다시 1로 돌아간다. 여러 번 클릭을 해도 한 번으로 인식해서, 계속 '홀수입니다' 라고 나온다. 

아예 function 에서 빼서 let count 를 설정해주면, 이런 오류가 나지 않는다. 

#Jquery란? 

 

자바스크립트는 HTML의 요소들을 조작하여 움직이게 한다.

JQuery는 Javascript를 미리 작성해둔 라이브러리. jQuery는 Javascript와 다른 특별한 소프트웨어가 아니라 미리 작성된 Javascript 코드다. 전문 개발자들이 짜둔 코드를 잘 가져와서 사용하는 것이기때문에, 쓰기 전에 "임포트"!

 

[서버- 클라이언트 통신]

Javascript 를 사용하면 페이지 전환 없이 서버에서 값을 받아올 수 있음. Json은 Dictionary + list 의 조합이다. 

Ajax는 jQuery를 임포트한 페이지에서만 동작 가능하다. 

 

#

(1) Function 을 디자인 할 때, 중간 중간 console 로 출력하고 잘 나오는지 확인하는 것을 습관화한다. 

쭉 짜놓고 에러 찾으면 어디서 났는지 찾기 어렵기 때문

(2) syntax error 

중괄호 하나 뺴먹는 실수가 잦다. 

functin 을 q1 - q3 로 여러개 실행할 때, q2 에서 )가 하나 빠졌더니, q1 도 실행되지 않는게 신기했음. 다 연결되어 있다. 

 

아래에서는 append를 for 문 밖으로 뺐는데 그러면 돌아가기만 하고 아무 결과도 안 나오는 셈이다. For 안에 넣어야 한다. 

 

(3) 값을 없애고 싶을 때 - return 넣어주기. 

#2과 퀴즈 리뷰 

 

(1) response 할 때 () 넣는 것 아님

(2) rate.json 파일 잘못 이해함. 예제 파일을 제대로 이해하자. 다 불러오는 게 아니고, 1번 dictionary 만 가져오면 된다.

(3) Id 와 variable 값은 다르게 주는 것이 맞다.

(4) .text 는 선택한 요소 안의 내용을 가져오거나 다른 내용으로 바꾸는 메소드. 데이터를 넣을 때는 .val 을 쓴다. 

 

#

파이참에서의 코드와 웹 브라우저 개발자 도구 수정의 차이. 

파이참의 코드는 수정하지 않는 한, 웹에서 작성한 코드 그대로 보여짐.

웹 브라웅저에서의 콘솔: 일회성. 개발자 도구의 코드는 새로고침 하게 되면 초기화.