JQuery 자주쓰는 문법

대상 지정하기  -   $('#대상')

id 값이 "대상" 인 것을 지정한다.

 

input 박스의 값을 가져오기  -  $('#대상').val()

// 크롬 개발자도구 콘솔창에서 쳐보기
// id 값이 url인 곳을 가리키고, val()로 값을 가져온다.
$('#url').val();

// 반대로 입력할때는? val() 괄호 안에 내용을 입력한다
$('#url').val('내용을 입력하자');

 

 

숨기기 / 보이기  -  $('#대상').hide() / $('#대상').show()

// 크롬 개발자도구 콘솔창에 쳐보기
// id 값이 post-box인 곳을 가리키고, hide()로 안보이게 한다.
$('#post-box').hide();

// show()로 보이게 한다.
$('#post-box').show();

 

 

태그 내 html 입력하기  -  $('#대상').append()

<div> ~ </div> 내에, 동적으로 html을 넣고 싶을 때

해당 div에 id를 추가해주는 것이 핵심

// 주의: 홑따옴표(')가 아닌 backtick(`)으로 감싸야 합니다.
// 숫자 1번 키 왼쪽의 버튼을 누르면 backtick(`)이 입력됩니다.
// backtick을 사용하면 문자 중간에 Javascript 변수를 삽입할 수 있습니다.
let temp_html = `<button>나는 추가될 버튼이다!</button>`;
$('#cards-box').append(temp_html);