본문 바로가기

jquery4

[ 스파르타 / Web ] 웹 퍼블리싱 정복 1주차 jQuery 자바스크립트에서 버튼 클릭 이벤트 예제 document.getEelementById('btn').addEventListener('click', function() { alert('버튼 클릭'); }); jQuery로 훨씬 간단하게 만들 수 있다. HTML 파일에 아래의 코드를 추가해준 뒤, JS파일에서 jQuery를 사용할 수 있게 된다. $('#btn').on('click',function() { alert('버튼 클릭'); }); // document = $ // getElementById('btn') = ('#btn') // .addEventListener() = .on transition 아래와 같이 버튼에 적용된 css가 있을 때, .btn { padding: 5px 20px; fo.. 2022. 11. 14.
[ 스파르타 / Web ] 웹개발 종합반 2주차_#3 (API) GET 데이터를 조회(Read)를 요청할 때 사용한다. POST 데이터를 생성(Create), 변경(Update), 삭제(Delete)요청 할 때 사용한다. 문제 아래의 사진에서와 같이 업데이트 버튼을 누를 시 미세먼지의 수치가 40 이상은 위험으로 나타내기 위해 빨간색으로 표시되게끔 만들어야 한다. 미세먼지 Open API http://spartacodingclub.shop/sparta_api/seoulair 위의 미세먼지 Open API 링크로 들어가면 아래와 같은 데이터가 보인다. 하지만 아래의 데이터는 보기가 힘들다. JSONView API 데이터 파일을 더 이쁘게 보기 위해서 JSONView를 깔아 주었다. (크롬에서 설치 가능) JSONView 브라우저에서 JSON 문서를 보세요. chrome.. 2022. 11. 3.
[ 스파르타 / Web ] 웹개발 종합반 2주차_#2 (jQuery) jQuery와 JavaScript를 사용하여 다음과 같은 기능들을 구현해 보았습니다. 문제 전체 코드 jQuery + Javascript의 조합을 연습하자! 1. 빈칸 체크 함수 만들기 1-1. 버튼을 눌렀을 때 입력한 글자로 얼럿 띄우기 [완성본]1-2. 버튼을 눌렀을 때 칸에 아무것도 없으면 "입력하세요!" 얼럿 띄우기 클릭 2. 이메일 판별 함수 만들기 2-1. 버튼을 눌렀을 때 입력받은 이메일로 얼럿 띄우기 2-2. 이메일이 아니면(@가 없으면) '이메일이 아닙니다'라는 얼럿 띄우기 [완성본]2-3. 이메일 도메인만 얼럿 띄우기 클릭 3. HTML 붙이기/지우기 연습 3-1. 이름을 입력하면 아래 나오게 하기 [완성본]3-2. 다지우기 버튼을 만들기 이름 붙이기 다지우기 세종대왕 임꺽정 2022. 11. 3.
[ 스파르타 / Web ] 웹개발 종합반 2주차_#1 (영화 후기 사이트) 2주 차에서는 jQuery, AJAX를 이용해 몇 가지 간단한 프로젝트를 만들었다. jQuery란 HTML의 DOM 조작과 이벤트 제어 그리고 Ajax 등 웹 화면을 다루는 자바스크립트 라이브러리이다. 우리는 JavaScript 를 기반으로 화면을 그려낼 때가 있다. 물론 JavaScript만 써도 충분히 화면 작업이 가능 하지만 보다 효율적이고 직관적이게 엘리먼트를 선택하고 제어할 수 있도록 해주는 JavaScript 라이브러리가 존재하는데 이게 바로 JQuery이다. JavaScript 를 보다 쉽게 쓰기 위해 사용하는 쿼리라고 보면 된다. jQuery 사용방법 내 생애 최고의 영화들 영화 기록하기 영화 URL 별점 --선택하기-- ⭐ ⭐⭐ ⭐⭐⭐ ⭐⭐⭐⭐ ⭐⭐⭐⭐⭐ 코멘트 기록하기 닫기 Movie .. 2022. 11. 3.
728x90