728x90 반응형 Fiori/UI548 [JavaScript] JSON Javascript Object Notaiton의 약자이다. 사람도 이해하기 쉽고 기계도 이해하기 쉬우면서 데이터의 용량도 적다. 이런 이유로 JSON이 XML을 대체해서 설정의 저장이나 데이터를 전송하는 등에 많이 사용된다. JSON 문법은 세 가지 타입을 사용한다. 단순한 값 : JSON에서 문자열, 숫자, Boolean, null은 모두 자바스크립트와 같은 문법으로 표현한다. Undefined는 지원되지 않는다. 객체 : 객체는 순서 있는 키-값 쌍으로 표현한다. 각 값은 원시 타입일 수도 있고 객체나 배열 같은 복잡한 타입일 수도 있다. 배열 : 배열은 숫자형 색인으로 접근할 수 있는, 순서 있는 목록으로 표현한다. 각 값은 단순한 값이나 객체, 다른 배열 등을 모두 쓸 수 있다. 자바스크립트에선.. 2023. 3. 7. [JavaScript] 이벤트 이벤트 등록하는 방법에는 3가지가 있다. inline 방식 태그안에 넣는 방법이다. 재사용이 불가능하다는 단점이 있다. buttonType propertyListener 방식 마지막에 셋팅한 event만 실행한다. buttonType 실행시 두번째 클릭 alert만 나온다. addEventListener 방식 세팅한 Event 모두 실행한다. 문법: addEventListener("이벤트종류","콜백함수"); buttonType 모두 실행되기 때문에 첫번째클릭, 두번째클릭 알림창이 모두 나온다. 숫자만 입력할 수 있게 하는 이벤트 2023. 3. 7. [JavaScript] Element 속성 속성은 HTML에서 태그명만으로는 부족한 부가적인 정보라고 할 수 있다. 이 속성을 제어하는 API를 알아본다. 텍스트를 누르면 네이버홈페이지가 나오고 버튼을 클릭한뒤 다시 텍스트를 누르면 다음홈페이지가 나오게 해본다. NAVER change 버튼을 클릭한뒤 브라우저에서 f12의 elements를 보면 id이름과 주소가 daum홈페이지의 값, 변경된값으로 바뀌어있는걸 확인할 수 있다. getAttribute(key) : 값 가져옴,return값 존재 setAttribute(key,value) : 값 내보냄, 값 세팅, return값 존재x 이미지를 클릭하면 커지고, change 버튼을 누르면 이미지가 변경되게 해본다. changeImg 2023. 3. 7. [JavaScript] Element 식별자 엘리먼트를 제어하기 위해서는 그 엘리먼트를 조회하기 위한 식별자가 필요하다. HTML에서 엘리먼트의 이름과 id 그리고 class는 식별자로 사용된다. 객체를 만들어줄때 property에 조회,생성,변경,삭제 등을 세팅해줄 수 있다. tagName 조회만 가능하게 하는 property이다. 변경되지않는다. Javascript 현재 javascript의 tagName은 "javascript"인데 "a"로 변경하려고 한다. 이때 ""안에 오는 선택자는 항상 문자열이어야한다. 마지막 write를 보면 이름이 변하지않고 그대로 LI로 출력되는데, 변경되지 않는다는걸 알수 있다. id 변경이 가능한 property이다. Javascript 브라우저에서 f12를 눌러서 elements에서 보면 로 변경되있는걸 확인.. 2023. 3. 6. [JavaScript] 문서 객체 모델(DOM) 접근 문서 객체 모델(DOM)은 HTML과 XML 문서에 대한 어플리케이션 프로그래밍 인터페이스이다. DOM은 문서를 노드의 계층 구조 트리로 표현하며 개발자는 이를 통해 페이지 각 부분을 추가, 제거, 수정한다. Document 타입에서 제공하는 메소드 (제어 대상 찾기) getElementById() getElementsByTagName() querySelector() querySelectorAll() getElementById() id를 사용해 속성을 제어한다. id는 객체로 가져온다. {} 객체가 없으면 null값이 return된다. id만 가져올 수 있다고 명시되어 있어 선택자에 id구분자#를 넣지 않는다. 여러 객체를 가져올땐 배열로 가져온다고 하고 하나의 객체를 가져올땐 객체로 가져온다고 한다. .. 2023. 3. 6. [JavaScript] Date 객체나 함수는 리터럴로도 사용할수 있는데, date는 new Date()으로만 사용이 가능하다. 1의 경우, 월 month가 index로 작용해서 dec으로 반환된다. 2의 경우는 (년,월,일,시,분,초)이다. 3의경우는 그대로 월 month가 11월 nov를 출력한다. 4의경우 ie에선 지원하지 않는다. 이때 getMonth는 월이 -1값으로 출력됨을 유의해야 한다. 요일은 일:0,월:1,화:2... 이런식으로 0부터 6까지 return값이 출력된다. 오늘 날짜를 출력해본다. 이 두 방법은 10월같은 달에도 앞에 0이 붙는다. 그래서 삼항연산자를 사용하는 다음과 같은 방법으로 한다. 삼항연산자를 사용해 월 month와 일 date가 10보다 작을땐 앞에 0을 붙여준다. 브라우저 객체 모델 브라우저 객체.. 2023. 3. 6. 이전 1 ··· 3 4 5 6 7 8 다음 728x90 반응형