jQuery의 $.ajax 메소드 - 비동기적(동시실행)으로 웹 서버와 통신하는 기술 - 웹 페이지의 내용을 새로 고침하지 않고도 웹 서버에서 데이터를 가져오거나 서버에 데이터를 보낼 수 있으며 웹 사이트의 사용자 경험을 향상시킬 수 있다. Json (JavaScript Object Notation) - 웹 어플리케이션에서 정보를 주고받을 때 사용하는 데이터 포맷 - 데이터를 쉽게 인코딩 & 디코딩 할 수 있어 웹 애플리케이션에서 서버와 클라이언트 간 데이터 교환 시에 많이 사용된다. Json샘플 데이터 참고 사이트 https://jsonplaceholder.typicode.com/ JSONPlaceholder - Free Fake REST API {JSON} Placeholder Free fake AP..

핸들바 (Handlebars) - 스크립트 내에서 html을 용이하게 작성할 수 있는 템플릿 엔진이다. - 코드의 재사용 및 유지 보수성을 향상시키며 jQuery와 같은 라이브러리와 함께 사용할 수 있다. #사용법 1. handlebars 라이브러리 로드 - 태그 안, 제이쿼리 cdn 아래에 해당 코드를 작성한다 2. 템플릿 정의 -핸들바를 사용할 곳에 - 핸들바 안에서의 반복문은 {{#each}}를 사용하며.(마침표)를 입력 시 전체를 반복한다는 의미이다. - 스크립트 내 배열 값을 가져올 때는 {{키네임}}으로 작성한다. (배열 키와 동일하게 넣어줌) - 반복문의 마감태그는 {{each}} ** {{키네임}} 으로 감싸진 부분이 주입되는 데이터와 바인딩되는 부분이다. ** {{#each}} {{/ea..

JQuery를 사용하려면 JQueryCDN으로 소스를 가져와야 한다. [아래 포스팅 참고] https://shinye-developmentdiary.tistory.com/8 제이쿼리(JQuery)를 사용하는 이유와 사용법 제이쿼리(JQuery)란 오픈소스 기반의 자바스크립트 라이브러리를 의미한다. 라이브러리는 SW의 구성요소 중 한 가지로 API를 바탕으로 대상 환경(플랫폼)에서 바로 실행될 수 있도록 모듈화 된 프 shinye-developmentdiary.tistory.com HTML 태그 영역 [주소입력] 이름 주소 [주소목록] CSS (html - head의 태그 안) h3{ color: rgb(6, 64, 172); } table{ border-collapse:collapse ; } td{ bo..

자바스크립트로 빙고게임 만들기 이틀차에는 자바스크립트를 이용해 빙고게임을 만들었다! 😆 ※대각선은 지원하지 않음※ 선택한 칸의 색은 노란색으로 바뀌며 가로줄과 세로줄이 모두 채워지면 빙고 = 해당 줄의 색이 분홍색으로 변한다. 아래 링크로 들어가면 직접 실행시킬 수 있으며 밑의 소스 코드 안 태그의 텍스트를 수정하여 새로운 빙고판을 생성할 수 있다. 빙고게임하러가기↓↓↓ https://shinye-developmentdiary.tistory.com/16 JavaScript Bingo game - 자바스크립트로 만든 빙고 게임 (색칠하기) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 shinye-developmentdiary.tist..

제이쿼리(JQuery)란 오픈소스 기반의 자바스크립트 라이브러리를 의미한다. 라이브러리는 SW의 구성요소 중 한 가지로 API를 바탕으로 대상 환경(플랫폼)에서 바로 실행될 수 있도록 모듈화 된 프로그램의 모음이다. 혼자서 동작하는 완전한 프로그램이 아니라 특정한 부분의 기능만을 수행하도록 제작되었으며 컴파일 기계어의 형태로 존재한다. 1. javascript , JQuery의 차이점 자바스크립트 : 선택자의 설정, 스타일 등 기존 명령이나 코드 작성이 달라 초반 진입장벽이 높다는 단점이 있으며 내장형 스크립트를 사용한다. 제이쿼리 : 자바스크립트의 진입장벽을 낮추기 위해 만들어졌으며 cdn방식이나 외부 연결방식으로 파일을 연결해 사용한다. (호환성 부분은 1.12.4 버전이 가장 안전함) [사용하는 이..

함수(function) javascript에서의 함수는 기능에 따라 실행되는 명령어들을 묶어놓은 객체이며 특정 기능을 수행하는 코드들을 하나의 명령어로 묶어 놓은 덩어리이다. [함수를 사용하는 이유] -퍼포먼스의 효율적인 관리 -각 명령어의 시작과 끝을 정확하게 파악할 수 있다. -함수의 이름을 붙여서 필요할 때마다 함수명만 호출해서 사용하면 되니 편리하다. -함수명은 임의대로 작성하여 사용하나, 작성법 주의사항은 변수명과 동일하다. 인자와 인수 -인수(매개변수) : 함수의 괄호 안에 선언되는 변수로 인자의 값을 받아온다. -인자 : 매개변수로 전달되는 실제 값 *매개변수는 특정한 함수 안에서만 사용되기 때문에 중복으로 사용할 수 있다. *매개변수를 여러 개 사용할 땐 , 콤마로 구분한다. *인수가 있을..

자바스크립트에 사용되는 조건문은 if문과 for문이 있는데 for문은 jQuery에 기본적으로 내장되어 있어서 잘 사용하지 않는다. if문은 하나 이상의 조건에 따라 실행할 명령어를 구분하여 실행시킨다. if문 구조 if(조건 1) {조건 1을 만족할 때 실행될 명령어 }else if(조건2){ 조건 2를 만족하면 실행될 명령어 }else if(조건3){ 조건 3을 만족하면 실행될 명령어 }else{ 위의 모든 조건문에 해당되지 않을 경우 실행되는 명령어} *괄호는 붙여 써도 됨 *마지막 else는 생략해도 된다. var question = confirm('대화창 생성하기') document.write(question) if(question==true){ document.write('예를 선택할 경우 나..

자바스크립트에서는 변수를 사용해서 중복적으로 사용해야 하는 데이터를 효율적으로 사용한다. 이 변수는 html에서 id와 같은 역할을 하며 다른 점은 중복으로 사용할 수 있다는 것이다. [변수(variable) 사용 법] 'var 변수명 = 데이터 값' 형태로 작성하며 호출 시 var를 넣으면 재선언이 되기 때문에 생략하고 변수명만 사용한다. var hello='안녕하세요' console.log(hello) document.log(hello) 변수명 규칙 1) 반드시 영문만 사용하며 숫자는 올 수 있으나 첫글자에는 사용할 수 없다(대문자도 불가) 2) 띄어쓰기, 특수문자 삽입 금지 (예외: - , _ ) 3) 약속되어 있는 예약어는 사용하지 않는 것이 좋다 (html에서 div, span과 같은 태그명을 ..