HTML,CSS,JavaScript11 JavaScript 게임만들기 , AJAX 캔버스 캔버스 그림을 그려줄 컨텍스트 객체 글씨를 그림으로도 그릴 수 있다. 게임 jQuery 자바스크립트 라이브러리→ 자바스크립트를 쉽게 쓸 수 있는방법을 연구했다. jQuery만 쓰는거는 안좋다. 빠르게 쓸수있지만 업그레이드가 안되면 진전이 없다. $(선택자).함수(); $는 jQuery를 의미함. 다운로드 방식 : https://jquery.com/ CDN방식 : https://developers.google.com/speed/libraries?hl=ko#jquery hide show toggle slideUp slideDown slideToggle 이 요소에는 스트롱요소가 있습니다. text() 읽어오기 html() 읽어오기 여기에 text 콘텐츠 작성하기 text() 쓰기 html() 쓰기 AJ.. 2023. 5. 11. JavaScript DOM과 이벤트처리, 유효성 검증 DOM (document object model) 문서 객체 모델 DOM은 HTML문서의 계층적인 구조를 tree로 표현한다. HTML, 문서를 객체로 표현한것을 DOM이라고 한다. DOM은 웹브라우저의 하얀색 영역을 담당한다. BOM은 웹브라우저를 객체로 표현한것이다. DOM과 BOM 차이점 DOM은 현재 보이는 하얀창을 제어한다면, BOM은 window속성에 속하여 웹 전체를 제어한다. (DOM은 BOM안에 있는 것이다. ) HTML 요소 찾기 id나 tag로 찾는다. (안드로이드는 findViewById나 뷰바인딩으로 찾았다.) tag는 s가 붙는다. 같은 tag가 많다. DOM tree 순회 Google DOM 제어 change image this is paragraph 스타일 변경 클래스 속성으.. 2023. 5. 10. JavaScript Object 객체 프로퍼티와 메소드를 묶어서 표현하는 기법 객체의 종류 생성자함수 : 객체를 생성할때 자동으로 호출하는 함수 내장 객체 build in object : 생성자가 미리 작성되어있음. (자바로 따지면 생성자는 클래스) 생성자(클래스)만 있는거 이미 new까지 되어있는것 객체 생성 방법 객체 상수로부터 만든다. (리터럴 객체) 만들면서 생성한다. 일회용으로 쓴다. 같은 구조를 띄고있는데 컬러만 바꾸고싶을때는? 다시 만들어야함. 재활용불가 필수! this를 쓰지 않으면 객체를 못알아듣는다. (전역변수라고 착각함.) 생성자 함수를 이용해서 만든다. 생성자 함수자체가 클래스 설계도면이다. 그냥보면 함수인지 생성자 함수인지 알아보기 힘들다. 메소드가 아니야. class목적으로 쓰는거라는걸 대문자로 표현함 func.. 2023. 5. 9. JavaScript 자바 스크립트란? 자바 스크립트란 ? 동적인 웹 페이지를 작성하기 위해 사용되는 언어 컴파일러를 별도로 설정하지 않아도 된다. → 브라우저가 번역해준다. 오개념 : 자바를 쉽게 쓴게 자바스크립트? 아니다. 자바 자바스크립트 언어 종류 소스파일을 컴파일하여 실행하는 컴파일 언어이다. 브라우저가 소스코드를 직접해석하여 실행하는 인터프리터 언어이다. 실행 방식 자바 가상 기계 위에서 실행한다. 브라우저 위에서 실행된다. 작성 위치 별도의 소스 파일에 작성 HTML, 파일안에 삽입가능 변수 사용 변수의 타입을 반드시 선언해야함 변수의 타입을 반드시 선언하지 않아도 사용가능(php와 같은 동적변수) ECMA6를 기준으로 완전히 달라졌다. 이 이후로 동적 페이지 작성위한 언어는 자바 스크립트로 통일되었다. 자바스크립트의 특징 인터프.. 2023. 5. 8. CSS3 부트스트랩 네이티브앱 웹앱 실행속도 빠름 일반적으로 느림 플랫폼 플랫폼마다 제작해야함 하나의 버전으로 모든 플랫폼에서 실행 가능 배포 앱 마켓을 통한 배포 필요 없음 버전 업데이트 시간이 걸림 즉시 반영 오프라인시 사용가능 약간의 기능만 사용가능 웹앱과 모바일웹은 다르다. 웹앱은 앱 안에 웹 뷰를 두는것을 말한다. 모바일웹은 핸드폰으로 보되 , 모바일에 맞춘 웹이다. 반응형 웹페이지 디자인 →포토폴리오 사용자의 환경을 읽어 적절하게 반응하는 페이지 (데스크탑, 태블릿, 모바일 width값에 따라서 CSS 코드를 따로작성해준다. ) 부트스트랩에서 만든 반응형 웹페이지 /* 미디어쿼리는 항상 작은 사이즈를 기준으로 만들자 */ /* 미디어 쿼리 적용 */ @media all and (min-width:320px){ #.. 2023. 5. 4. CSS 회원가입 창 만들기 회원정보입력 아이디 중복검사 패스워드 패스워드확인 이름 휴대폰 번호 이메일 생일 홈페이지 남성 여성 2023. 5. 3. 이전 1 2 다음