Java Script6 2-5 Quiz_JQuery 연습하기 완성코드 jQuery + Javascript의 조합을 연습하자! 1. 빈칸 체크 함수 만들기 1-1. 버튼을 눌렀을 때 입력한 글자로 얼럿 띄우기 [완성본]1-2. 버튼을 눌렀을 때 칸에 아무것도 없으면 "입력하세요!" 얼럿 띄우기 클릭 2. 이메일 판별 함수 만들기 2-1. 버튼을 눌렀을 때 입력받은 이메일로 얼럿 띄우기 2-2. 이메일이 아니면(@가 없으면) '이메일이 아닙니다'라는 얼럿 띄우기 [완성본]2-3. 이메일 도메인만 얼럿 띄우기 클릭 3. HTML 붙이기/지우기 연습 3-1. 이름을 입력하면 아래 나오게 하기 [완성본]3-2. 다지우기 버튼을 만들기 이름 붙이기 다지우기 세종대왕 임꺽정 하면서 실수했던 부분: id값을 불러오는 let a= $('#id') 를 function blah() .. 2022. 5. 13. 2-4 JQuery 적용하기(포스팅 박스) _ .show & .hide / display:none 영화 기록하기 버튼을 누르면 숨겨진 창이 나타나고 닫기를 누르면 사라짐. 1. 각 버튼에 먼저 function을 연결시켜준다. 영화 기록하기 닫기 function open_box(){ } function close_box(){ } 2. 타겟 창의 div 에 id 값을 주기. ex) 3. 타겟 창 제어하기. function open_box(){ $('#post-box').show() } function close_box(){ $('#post-box').hide() } **post-box를 시작부터 감춰두기: css를 display:none 으로 설정 2022. 5. 13. 2-3 jQuery 다루기 ( $('#url') / hide / show / temp_html ) HTML 코드에서 특정값 가져오기 $('#id').val 1) 영화URL input박스에 id를 지정해줌 (url) 2) $('#url').val(); id 값이 url인 곳의 값(val)을 가지고 온다. $('#url').val('여기에 써져있는 값을 불러올수도 있다.') val('~~~')의 값을 불러올 수 도 있다. hide / show $('#post-box').hide(); id 값이 post-box인 곳을 가리키고, hide()로 안보이게 한다. $('#post-box').show(); id 값이 post-box인 곳을 가리키고, show()로 보이게 한다.▶ temp_html 태그 내에 html 입력하기 예) ~ 내에, 동적으로 html을 넣고 싶을 때 1. 원하는 div에 id 추가 2. .. 2022. 5. 13. 2-2 jQuery 시작하기 jQuery 란? CSS 를 미리 작성해두어 편리하게 쓰는것이 bootstrap인 것 처럼 Java script를 미리 작성해두어 가져다 쓸수 있는것이 jQuery. JS 와 jQuery 코드비교 JS document.getElementById("element").style.display = "none"; jQuery $('#element').hide(); jQuery 사용법 https://www.w3schools.com/jquery/jquery_get_started.asp jQuery CDN 부분을 참고 사이에 아래 코드를 넣음 ✔️CSS 처럼 대상을 선택해야 조작할수 있음. 예) 특정 inputbox의 값을 가져와줘 ✔️ CSS는 선택자를 'class'로 썼지만 JS 에서는 'id'를 쓴다. 2022. 5. 12. 이전 1 2 다음
