국비 과정/JavaScript9 국비 - 0929 ( 이미지 로딩 , 드래그 앤 드롭, 스토리지 ) * 이미지 객체 생성 캔버스에 이미지를 그리기 위해서는 이미지를 담을 이미지 객체가 필요하다. var img = new Image(); img.onload = function(){ // 이미지 로딩이 완료되면 함수 코드 실행 ... //이곳에 img 객체에 로드된 이미지를 그리는 코드 작성 } img.src = "test.png"; // img 객체에 test.png 파일로부터 이미지 로딩 시작 이미지 로딩이 완료되어야 이미지를 그릴 수 있으므로, 이미지 로딩을 지시하기 전 img.onload 리스너에 이미지가 로딩되었을 때 이미지를 그리는 자바스크립트 코드를 등록해둔다. 이미지 그리기 이미지 로딩이 완료되면 컨텍스트 객체의 drawImage() 메서드를 이용하여 이미지를 그린다. drawImage() .. 2022. 9. 29. 국비 - 0928 ( JSON , CANVAS) * JSON 객체 JSON(Javascript Object Notation) 객체는 클라이언트와 서버의 통신에서 데이터를 주고 받을 때 주로 이용 합니다. 프로그램 종류에 구애 받지 않고 가벼운 텍스트 형태로 만들어 졌다는 장접이 있어 개발자들이 많이 사용합니다. JSON 은 lightweight(저중량) 데이터를 교환하는 형식으로 컴퓨터 시스템이 파싱하고 생성하기 쉽게 만들어졌습니다. . JSON 은 다음과 같은 특징을 갖고 있습니다. JSON 은 Javascript 를 기반으로 만들어 졌으며 특정 언어에 종속 되지 않는 완벽한 독립적인 텍스트 형식을 갖고 있습니다. JSON 객체의 데이터는 이름 (key) / 값(value) 의 쌍으로 구성합니다. { 로 시작해서} 로 끝납니다. key 와 value.. 2022. 9. 28. 국비 - 0927 ( Screen ) * Screen 객체 screen은 브라우저가 실행되는 스크린 장치에 관한 정보를 담고 있는 객체이다. screen 객체는 다음과 같이 접근한다. window.screen 혹은 screen * screen 객체의 프로퍼티 . availHeight // 작업 표시줄 등을 제외하고 브라우저가 출력 가능한 영역의 높이 . availWidth // 작업 표시줄 등을 제되하고 브라우저가 출력가능한 영역의 폭 . pixelDepth // 한 픽셀의 색을 나타내기 위해 사용되는 비트 수 . colorDepth // 한 픽셀의 색을 나타내기 위해 사용되는 비트 수로서 pixelDepth 와 동일 . 대부분의 브라우저에서 지원되므로 pixelDepth 보다 colorDepth 를 사용 할 것을 권함 . availHeig.. 2022. 9. 27. 국비 - 0926 ( BOM ) * BOM ( Browser Object Model ) DOM 객체들은 HTML 페이지의 각 HTML 태그들을 객체화 한것으로 자바스크립트 코드로 화면에 출력된 HTML 태그의 콘텐츠나 모양을 변경하기위해 설계되었다. BOM 은 윈도우 , 윈도우에 로드된 문서의 URL , 브라우저가 출력된 스크린장치, 브라우저의 종류와 기능 등 브라우저와 브라우저가 실행되고 있는 환경을 자바스크립트 코드로 접근하고 제어할수 있도록 설계된 객체들의 그룹을 일컫는다. BOM의 종류 대부분의 브라우저들은 다음의 BOM 을 제공하며 , 개발자들이 자바스크립트를 이용하여 브라우저와 관련된 정보를 얻고 브라우저와 윈도우를 제어 하도록 한다. .window 객체는 브라우저가 제어하는 BOM 객체의 최상위에 존재한다. . window.. 2022. 9. 27. 이전 1 2 3 다음
