[22.10.07]today I learned

today I learned
00.jQuery, Ajax
1. jQuery란
2. jQuery 사용 예제
3. includes 메소드
4. split 메소드
5. Ajax 기본 골격
6. 로딩 후 호출하기

1. jQuery란

• HTML의 요소들을 조작하는, 편리한 Javascript를 미리 작성해둔 것. 라이브러리.
• jQuery 사용법
  1-1) 와 사이에 jQuery CDN 넣기

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

2. jQuery 사용 예제
2-1) input 값 가져오기

$('#url').val();

2-2) input 값 입력하기

$('#url').val('이렇게 하면 입력이 가능하지만!');

2-3) 보이기, 숨기기

$('#post-box').hide();
$('#post-box').show();

2-4) html만들어서, 넣어주기

let temp_html = `<button>나는 추가될 버튼이다!</button>`;
$('#cards-box').append(temp_html);

2-5) 태그 내용 비우기

$('#names-q3').empty();

2-6) 이미지 바꾸기

$("#아이디값").attr("src", 이미지URL);

2-7) 텍스트 바꾸기

$("#아이디값").text("바꾸고 싶은 텍스트");

3. includes 메소드

• email@.includes('@') => true
• 있으면 true, 없으면 false

4. split 메소드

• info@gmail.com에서 gmail만 뽑고 싶다면
  1) let email = info@gmail.com
  2) let delete1 = email.spilt('@')[1]
  3) let delete2 = delete1.spilte('.')[0]

5. Ajax 기본 골격

$.ajax({
  type: "GET",
  url: "URL",
  data: {},
  success: function(response){
    console.log(response)
  }
})

6. 로딩 후 호출하기

$(document).ready(function(){
	alert('다 로딩됐다!')
});