피터의 끄적끄적

자바 스크립트는 HTML 파일 어디에나 작성 할 수 있다.주로 head 나 body의 마지막 부분에 작성한다. HTML 파일에 직접 코딩하지 않고도 파일 경로만 확실하게 적어주면 자바 스크립트 파일을 불러올 수 있다 자바 스크립트를 이용해서 콘텐츠를 수정 할 수 있다.Click me to change the text to FrenchHi there!document.getElementById를 이용해서 ID가 French 인 항목을 Hi there! 에서 Salut! 로 변경했다. Click me to change the style of the textHello worlddocument.getElementById를 이용해서 ID가 hello 인 항목의 스타일을 변경했다.

JSON은 JavaScript Object Notation 의 줄임말이다.대부분의 웹 어플리케이션들은 XMl 이나 JSON을 이용해서 데이터를 저장한다.JSON은 "Self-describing"이 가능하며 이해하기 쉽다.예시){ "firstName":"John", "lastName":"Smith", "domestic":true, "fee":100.5}데이터는 쉼표로 분류 가능하다데이터는 이름과 값이 한쌍이다 자바스크립트를 JSON형식으로 변환 가능하다.objJSON = JSON.stringify(obj);반대로 JSON을 자바스크립트로 변환 가능하다.obj = JSON.parse(objJSON);JSON 오브젝트를 생성하는 코드JSON: Example 1: JSON.stringify..

XSD는 DTD의 단점을 개선한 스키마 언어이다. XSD는 XML 문법으로 작성할 수 있어서 확장이 용이하다. 위와같이 스키마를 이용해 xsd라는 걸 미리 선언해야한다 xsd 파일을 보면 2가지의 구조로 나눌수 있다complexType 복합타입 - 자식 요소나 속성을 포함하는 요소이다simpleType 단순타입 - 오직 값만을 포함한 요소이다, 자식이나 속성 요소는 포함이 불가능하다.복합타입 예시속성을 포함하는 복합타입 예시자식과 속성 요소를 둘다 포함하는 복합타입속성 요소만 포함하는 복합타입 위 코드와 비교단순 타입 예시단순 타입에 제한을 둘때date 안에 person 데이터가 있기 때문에 date 먼저 attribute 로 안에attribute 는 attribute에 sequence 는 sequence에

XML DTD ( Document Type Definition ) 문서타입정의DTD를 이용하면 다른 파티에 있는 데이터도 하나의 XML 파일으로 정리가 가능하다.DTD 파일은 2개의 타입이 있다Internal DTDExternal DTDInternal DTD 내부 DTD ]> John Smith jsmith@gmail.com 0211223344 External DTD 외부 DTD외부 DTD를 사용한다는 것을 알리기 위해서 standalone 코드의 값을 "no"로 지정을 해둔다.student 요소는 (firstname,lastName,email) 세개의 데이터를 포함한다는 뜻의 DTD 파일이다. DTD 요소를 이용하면 2개의 데이터 요소를 하나로 포함 시킬..

XML Declaration 란 ...? John Smith jsmith@gmail.com 0211223344XML Declaration 즉 XML의 선언이란 필수요소는 아니지만 기재시 제일 첫번째 문장에 위치해야하고 모든 XML 문서는 선언 (declaration)으로 시작해야한다.  * XML 파일은 빈 문장으로 시작해서는 안된다 * XML declaration들version = XML 문서에 사용된 XML 버전.encoding = XML 문서의 문자셋, 기본값은 UTF-8 이다.standalone = XML 문서가 외부 DTD와 같은 외부소스의 데이터에 의존하고 있는 문서인지 아닌지 알려준다.XML Root 란 ...? XML Root 즉 XML 의 뿌리 (root element) 는 XML 선언 ..

유저가 하얀 원을 클릭하면 검정 원으로 변경, 검정 원을 클릭하면 하얀 원으로 변경images 폴더에 2개의 사진을 저장  클릭시 특정 웹사이트로 이동하는 코드Click me to visit UOW function goToUOW() {window.location.assign("http://www.uow.edu.au");} 유저가 입력한 값을 대문자로 바꾸는 기능Enter discount code:function uppercase(){ var e = document.getElementById("discountCode"); e.value = e.value.toUpperCase();} 마우스 커서를 올렸을 시 특정효과가 나타나는 기능Click MeMouse Over Me createElemt 를 이용해서 웹사..

유저가 입력한 Value를 찾을때In a form, to get user input value, we can use:form을 사용할때 유저가 입력한 값을 구하기 위해서 var feeAmount = document.getElementById("fee").value;form을 사용할때 특정값을 기본값으로 설정하기 위해서In a form, to set the value of an input field, we can use:document.getElementById("fee").value = "230.50"; 5와 15 사이의 랜덤 숫자를 구할때var x = Math.floor(Math.random() * (15-5+1) ) + 5최대 - 최소 값 +1

Form validation (Form 인증)  ... form 작성 ...form 속성 중 하나인 onSubmit 을 이용해서 데이터 input을 서버에 보내기 전 확인 Email: 예시 3) 0부터 9까지의 수로 다섯자리 만들기Enter some text with pattern 1~3 자릿수, 마침표가 있어야하고 다시 1~3자릿수가 필요한 조건한자릿수보다 크거나 같은 자릿수 (*$), 그리고 소문자가 필요한 조건NSW 혹은 ACT 등 그리고 띄어쓰기 후 4자릿 수 0-9가 필요한 조건0(1-9) 혹은 1(0-2) - 20 그리고 1(0-9) 혹은 2..

onclick 사용법 onclick="alert();" Click me Click me 각 Button에 대해 클릭 했을 시 무엇이 팝업창에 뜰지 지정 가능 Hi 라는 메세지와 (1+1) 즉 숫자 2를 팝업창에 띄움 onclick="console.log();" Click me Click me console.log 코드를 이용해 크롬 콘솔창에 저장 가능 이 두개의 코드를 동시에 이용 가능 Click me Hi 를 팝업창에 띄우면서 콘솔창에 정보르 저장 가능 버튼을 클릭 했을 시 sayHi() 라는 코드를 불러옴 JavaScript 를 이용해서 값 변경 Click me to change the text to French Hi there! Id가 french여서 같은 Id 이므로 단순히 버튼을 클릭하면 Hi ..

HTML 은 Hyper Text Markup Language의 약자 이다 Hello World! HTML 은 반드시 head 와 body가 있어야 한다head 와 body의 끝맺음을 빼먹지 않는것도 중요하다 은 웹사이트의 이름이된다주로 에 코드들을 적는다고 생각하면 편하다 안에 들어가는 코드들은 tag (태그) 라고 생각하면 된다  Heading tags Heading 1 Heading 2 Heading 3 Heading 6 Normal text...h1 이 가장 중요한 heading이 된다h6 은 가장 중요하지 않은 heading 이다 Paragraph tag  This is a paragraph Another paragraph yet another paragraph 글자들을 여러 방법으로 띄어쓰..