앱 만들기/JavaScript study38

14강. HTML요소 클릭시 동작하도록 만들기. 13강. 자바스크립트 함수 사용법함수란 자바스크립트 블록문을 하나의 어떤 액션(특정작업)을 할 수 있도록 만든 것이다.함수의 구조는 하기와 같다. function 함수이름(){ 자바스크립트 구문} 함수를 만들기 위해서는 먼저1. fusoo0100.tistory.com HTML요소 즉, 화면에 보이는 버튼 이미지, 텍스트 등을 선택시 어떤 액션이 동작하도록 구현하기 위해서는HTML요소에 자바스크립트 코드를 직접 등록하면 된다. 구글 홈페이지 네이버로 이동 HTML 요소가 클릭 되었을때, 자바스크립트 코드가 동작하기 위해서는해당 HTML요소에 onclick 속성을 추가하면 된다. onclick="자바스크립트 코드; " 쌍따옴표 사이에는 자바스크립트 코드를 작성하고 마무리는 ; 을 꼭 적어준다. 위.. 앱 만들기/JavaScript study 2024. 7. 11.

13강. 자바스크립트 함수 사용법 12강. 자바스크립트 if 조건문 사용방법11강. 자바스크립트 블럭 과 변수 사용법HTML과 CSS로 만들어진 웹 사이트는일반적으로 정보를 기술하고 보여주는 역할만 할 수 있다. 사용자가 특정액션을 취했을때 동작을 하거나 상호 반응을soo0100.tistory.com 함수란 자바스크립트 블록문을 하나의 어떤 액션(특정작업)을 할 수 있도록 만든 것이다.함수의 구조는 하기와 같다. function 함수이름(){ 자바스크립트 구문} 함수를 만들기 위해서는 먼저1. function 키워드를 적어준다.2. 함수 이름을 적고 ()를 붙여준다3. () 괄호 안에는 매개변수(parameter)라고 불리는 값이 들어올 수 있다. 공백일 때는 값이 없을 때이다.4. {} 안에 자바스크립트 구문들이 실행된다.5. {} .. 앱 만들기/JavaScript study 2024. 7. 8.

12강. 자바스크립트 if 조건문 사용방법 11강. 자바스크립트 블럭 과 변수 사용법HTML과 CSS로 만들어진 웹 사이트는일반적으로 정보를 기술하고 보여주는 역할만 할 수 있다. 사용자가 특정액션을 취했을때 동작을 하거나 상호 반응을 보이기 위해서는 자바스크립트라는 프로soo0100.tistory.com 자바스크립트 if 조건문은 참/거짓에 따라 명령문을 분기하는 구조를 가진 조건문 이다.If() 다음의 괄호 안에 값이 참이면, { } 괄호 안의 구문이 실행되고 거짓이라면 실행되지 않는다. if(참/거짓){ statement(구문)} 추가로, else{ } 도 사용이 된다. if() 조건문이 거짓이라면 else { } 안의 구문이 실행된다. if(참/거짓){ 참일때 }else{ 거짓일때 } 예제를 실행하면, 두개의 문자열이.. 앱 만들기/JavaScript study 2024. 7. 6.

11강. 자바스크립트 블럭 과 변수 사용법 10강. 하이퍼링크 만들기웹 사이트는 많은 웹 페이지들로 연결되어 있다.특정 이미지나 텍스트를 클릭하면 새로운 페이지가 열리는 동작을 하이퍼링크 라고 말한다.HTML a태그 가 바로 이 하이퍼링크 기능르 수행한다. soo0100.tistory.com HTML과 CSS로 만들어진 웹 사이트는일반적으로 정보를 기술하고 보여주는 역할만 할 수 있다. 사용자가 특정액션을 취했을때 동작을 하거나 상호 반응을 보이기 위해서는 자바스크립트라는 프로그래밍 언어를 사용해야 한다. 대표적인 것이 게임이다. 자바스크립트를 사용하면 웹 게임 역시 개발이 가능하다. 웹 문서에서 자바스크립트를 사용하기 위해서는 닫힘 태그 사이에 자바스크립트를 코딩해야 한다.즉, 브라우저에게 script 태그 사이의 콘텐츠 가 "자바스크립트 코.. 앱 만들기/JavaScript study 2024. 7. 5.

자바스크립트 String 데이터 형 자바스크립트에서 문자열 은 String 이라는 데이터 형 입니다. 먼저 문자열을 만드는 방법을 알아봅니다. 1. "" 쌍따옴표 or ' ' 따옴표로 문자를 둘러싸기 "안녕하세요" , '안녕하세요' 라고 자바스크립트 코드를 적으면 문자열로 인식 합니다. 문자들을 "", '' 사이에 적습니다. 2. typeof "문자열" typeof "문자열" 로 코드를 실행해보면 string 이라는 자료형을 보여줍니다. "", '' 로 표현되는 문자열은 string 자료형 이라는 것을 알 수 있습니다. 3. 백틱 `` 으로도 문자열을 Tab 키위의 `` 백틱 사이에 `안녕하세요` 라고 표현하여도 문자열이 됩니다. 줄 띄우기는 백틱`` 이 더 유리하다 " ", ' ' 에 비해서 백틱' ' 은 줄 띄우기에 더 편리합니다. ".. 앱 만들기/JavaScript study 2023. 8. 17.

자바스크립트 변수에 대해서 x = 5; y = 6; z = x + y; 자바스크립트 변수는 총 4가지 타입이 있습니다. 즉 4가지 방식으로 변수를 선언할 수 있다는 뜻입니다. 그 네 가지 방식은 하기와 같습니다. Automatically Var let const 입니다. Automatically는 자동으로 형이 부여되는 것으로 변수 앞에 아무런 키워드 도 적지 않는 것입니다 예를 들면 이러합니다. x = 5; y = 6; z = x + y; C 나 Java 등의 언어에서는 컴파일 오류가 날 수 있는 것도 자바스크립트에서는 유연하게 값을 도출해 냅니다. 하지만 이런 너무나 높은 자유도 때문에 생각지 못한 논리적 오류가 생길 수도 있습니다. 그래서 웬만하면 이런 방식은 지양하는 것이 좋고, 변수 선언지 키워드를 사용해야 합니다. Va.. 앱 만들기/JavaScript study 2023. 8. 16.

자바스크립트 이벤트 자바스크립트 이벤트 는 HTML 요소에서 이벤트 핸들러 속성에 의해서도 설정 됩니다. 그리고, 다음과 같은 상황에서 실행이 됩니다. HTML 페이지 로딩이 완료 되었을때. HTML input field 가 변경 되었을때, HTML 버튼이 클릭 되었을때,, 이외에도 많은 이벤트 가 있지만 주로 이러 합니다. 이런 이벤트들이 일어날때 해당 HTML 요소에 등록된 핸들러에 의해서 자바스크립트 코드나 함수가 실행되는 구조 입니다. HTML 요소에 등록되는 이벤트 핸들러의 문법 syntax 는 하기와 같습니다. 자바스크립트 코드는 쌍따옴표 혹은 싱글따옴표 안에 코딩하면 됩니다. 버튼 클릭 예제를 만들어봅니다. The time is? 버튼에 onclick 이벤트 핸들러를 등록합니다. 즉, 버튼이 클릭했을때 날짜 정.. 앱 만들기/JavaScript study 2023. 8. 15.

HTML 마우스 이벤트 HTML 마우스 이벤트 중 마우스를 특정 영역에 올려두었을 때와 (포커스) 포커스 되지 않았을때 를 구별하는 동작을 구현 해봅니다. 먼저 예제를 만들어 봅니다. ChangeBackground onmouseover 속성 : 마우스가 해당 요소에 올려졌을때 (포커스 되었을때) on mouseleave 속성 : 마우스가 해당 요소에서 벗어날때 (포커스 해제시) 위 코드는 해당 이벤트가 발생시 스타일로 배경색을 조정하는 예이며, 결과는 하기와 같습니다. 이외에도 마우스 관련 이벤트가 많습니다. 모든 것을 암기하지 말고, 필요할때 마다 html mouse event 등으로 검색해서 해당 예제등을 적용하면 되겠습니다. 감사합니다. Mouse Events W3Schools offers free online tutor.. 앱 만들기/JavaScript study 2023. 8. 14.

JS document.getElementbyID().innerHTML 자바스크립트 document.getElementByID().innerHTML 속성에 대해서 알아봅니다. 먼저, document.getElementById("id") 메소드를 사용하면 인자 값인 "id" 를 id 로 가진 HTML 요소에 접근이 가능합니다. 그렇게 접근한 다음 .innerHTML property(값)을 통해서 해당 HTML 요소의 값을 수정하는 것 입니다. 이 방법이 일반적으로 자바스크립트를 사용해서 HTML 의 요소에 접근하는 방법 중 하나 입니다. 예제를 만들어 봅니다. test demo 라는 아이디를 가진 p 요소에 접근하여 해당 값을 "Hello Happy day!" 라고 바꾸어 주는 코드 입니다. 참고로, 리스트를 가지는 요소에 접근하여 리스트 값을 얻어 올수도 있습니다. 예제를 .. 앱 만들기/JavaScript study 2023. 8. 10.

JS 함수 사용 방법 자바스크립트 함수를 만들고 사용하는 방법 입니다. 함수를 만들면, 코드를 재사용하기에도 유지보수 하기에도 편리하고 효율적이기에 필수적으로 사용되고 있습니다. JS 함수 를 만드는 Syntax 을 살펴봅니다. 함수 Syntax 1. function 이라는 키워드를 제일 앞에 적어줍니다. (C,Java 등의 언어와는 가장 다른 차이점인거 같습니다 ^^) 2. 그 다음 함수에 사용될 이름을 적어준다 3. () 괄호 안에 인수 값을 적습니다. 인수들은 함수내에서 지역변수 로 사용됩니다. - 즉, 함수가 시작될때 생성되고, 함수가 마칠때 소멸 됩니다. 4. { } 안에 함수에서 실행될 코드를 코딩합니다. 5. 때에 따라 return 키워드를 사용해도 함수를 호출한 곳으로 return 에서 계산된 값을 돌려줍니다... 앱 만들기/JavaScript study 2023. 8. 8.

이전 1 2 3 4 다음

티스토리툴바