웹 프로그래밍/JavaScript (58) 썸네일형 리스트형 [JS] 예외처리, 사용자 정의 예외 처리 JAVA에서는 예외라고 하는 상황을, JS에서는 에러라고 한다. new Error(e) 등의 형태로 쓴다. - e.message 에러 처리 사용자 정의 에러 : 조건문 내에 throw new Error('~~~')라고 작성하면 사용자가 정의한 에러 처리 가능. [JS] 객체 to 문자열 : JSON.stringify() & 문자열 to 객체 : JSON.parse() 예제 코드 JSON.stringify(), JSON.parse() 활용 예제. (eval() 함수를 활용하는 방법도 있음. 그러나 추천하지는 않음) 활용(1) 자바 클래스 멤버변수들을 파싱해서 사용할 수 있다. function을 받아 올 필요는 없다. 값을 뿌려 주기 위해 활용하는 거니까. 또한, 공공API에서 JSON 형태를 제공한다. 즉, 자바스크립트로 활용할 수 있다. 프론트 - 백엔드 : 바이트 스트림으로 자료를 주고받기 때문에, JSON 객체 자체로 보낼 수 없고, 문자열로 주고받는다. 백엔드(서버, JAVA로 구성)에서 날라오는 JSON 형태의 문자열을 파싱(JSON.parse)해서 자바스크립트 객체로 활용할 수 있다. 반대로, 프론트(자바스크립트)에서 날라오는 JSON 형태의 문자열을 파싱해.. [JS] DOM : form 태그 응용, 조건에 따른 submit 활용(onsubmit) 아래와 같이 onsubmit에 return false 라고 쓰면, submit 버튼을 눌러도 action이 가리키는 곳으로 이동하지 않는다. onsubmit 형태 onsubmit = "return false" onsubmit = "return true" 선택하세요 제목 작성자 어떤 조건에 따라 이동할 것인지, 이동하지 않을 것인지 선택할 수 있게 구현해보자(onsubmit을 응용). 1. select 내에 option을 '제목' 또는 '작성자'를 선택하지 않으면, action으로 이동하지 않게 해보자. 2. input 태그 내에 text 타입에 내용을 작성하지 않으면, action으로 이동하지 않게 해보자. // if(f.searchType.selectedIndex == 0) { // if(f.searc.. [JS] DOM : form 태그(document.name속성명), checkbox 버튼 전체선택, 전체취소, 결과보기 오로지 form 태그만 'document.name속성명' 으로 접근할 수 있음 원래는 아래와 같이 속성에 접근해야 한다. 하지만! form 태그 내에서는 document.'name속성명'.'name속성명' 등으로 접근할 수 있다. form 태그에서만 이렇게 접근할 수 있다. 그리고, 여기서 중요한 정보는 value의 속성값들이다. 이 value 속성값을 전달하고 활용하는 것이다. 당신의 취미는? 음악감상 영화감상 등산 게임 전체선택, 전체취소 함수를 toggle() 이라는 함수 하나로 통합할 수도 있다. for 반복문 쓸 때, in으로 돌리니까 제대로 실행되지 않았음. 이런 경우가 있다고 함. 따라서, for 반복문을 쓸 때는 length만큼 돌리는 것이 더 일반적이라고 함. 당신의 취미는? 음악감상 영.. [JS] DOM level 2 : 표준 이벤트 모델 (이벤트 캡쳐링, 이벤트 버블링 비교) 이벤트 버블링 : 하위태그에서 상위태그로 순차적으로 같인 이벤트가 실행됨 이벤트 캡쳐링 : 이벤트 버블링과 반대되는 개념이다. 상위태그에서 하위 태그 순으로 같은 이벤트가 실행된다. 표준 이벤트 모델 : addEventListenr(이벤트속성, handler, capture사용여부) : onclick 이벤트속성은 'click'만 쓰면 된다. CLICK [JS] DOM level 0 : 고전 이벤트 모델 vs 인라인 이벤트 모델 고전 이벤트 모델 예시 CLICK 인라인 이벤트 모델 예시 당신의 취미는? 음악감상 영화감상 등산 게임 [JS] 태그 가져오기(2) document.querySelector(), querySelectorAll() queryselector : 만나는 첫번재 태그를 가져온다. document.querySelector(".myclass"); queryselectorAll : 해당하는 모든 태그를 가져옴 let nodes = document.querySelectorAll('td') ID PASSWORD [JS] 버튼을 누를 때마다 동적으로 변하는 페이지 만들기(숫자 증감) 0번 클릭 클릭 숫자감소 10번 이전 1 2 3 4 5 ··· 8 다음
